HTML中怎样判断button这一按钮是否被点击? 20

简单点的。只要判断出button是否被点击就可以了……... 简单点的。只要判断出button是否被点击就可以了…… 展开
 我来答
吃完这颗猫粮就减肥
2018-03-31 · TA获得超过8248个赞
知道小有建树答主
回答量:64
采纳率:0%
帮助的人:8508
展开全部

想要判断出按钮是否被点击,这个功能必须配合javascript才能实现,只是HTML是没有这个功能。

<input type="button" value="点击测试"/>

首先需要添加点击事件,暂时定义为点击后执行一个函数,函数名定义为Clicked。

<input type="button" value="点击测试" onclick="Clicked()"/>

然后在按钮外部添加一个<script>标签作为Clicked函数的容器:

<script type="text/javascript"></script> 

其中text/javascript是告诉浏览器script标签中的内容以javascript方式解读。

再把函数Clicked写入script标签:

<script type="text/javascript">function Clicked(){}</script>

var clkBool=false;

这句话要写在Clicked函数外部,用于浏览器加载页面时,即立马定义clkBool值为false,而无关Clicked函数执行与否。然后点击之后,将clkBool赋值为True。

clkBool=true;

这句话要写在Clicked函数内部,仅当Clicked函数执行时(按钮点击时)才调用这句代码,则完整script标签如下:

<script type="text/javascript">

var clkBool=false;function Clicked(){clkBool=true;}</script>

再通过另一段javascript来调用(javascript可以调用HTML,而HTML无法调用javascript),设定另一个按钮来查看之前的按钮是否被点击过:

<input type=" button" value="判断点击" onclick="CheckClk()"/><script type="text/javascript">function CheckClk(){//定义函数CheckClkif (clkBool) {//用if判断clkBool的值,一般写作if(clkBool==true),但(clkBool==true)本身返回结果就是true和false,返回结果一定等于clkBool本身,所以可以这么写alert("按钮已经点击过");//弹出警告框}else{//如果不满足if的条件alert("按钮未被点击");//弹出警告框}}</script>

两个按钮及按钮对应的script标签合并,最终代码:

<input type="button" value="点击测试" onclick="Clicked()"/>
<input type=" button" value="判断点击" onclick="CheckClk()"/><script type="text/javascript">var clkBool=false;function Clicked(){clkBool=true;}function CheckClk(){if (clkBool) {alert("按钮已经点击过");}else{alert("按钮未被点击");}}</script>

悄悄de爱上
2017-07-24 · TA获得超过2050个赞
知道小有建树答主
回答量:597
采纳率:66%
帮助的人:334万
展开全部

一般来说要实现这个功能必须配合javascript才能实现,纯HTML没有这个功能。举个例子。

①这个是单纯的一个按钮,没有任何记录点击与否的功能,只能响应鼠标事件如鼠标在按钮上、鼠标点击按钮、鼠标松开按钮等功能:

<input type="button" value="点击测试"/>

单独对于该按钮,点击之后一切初始化,如同点击之前一样。此时则需要调用javascript,调用onclick点击事件,如果点击之后需要执行的动作比较多,还需要在按钮之外添加点击事件发生后执行的函数。

②首先需要添加点击事件,暂时定义为点击后执行一个函数,函数名定义为Clicked。

<input type="button" value="点击测试" onclick="Clicked()"/>

③然后在按钮外部添加一个<script>标签作为Clicked函数的容器:

<script type="text/javascript"></script>

其中text/javascript是告诉浏览器script标签中的内容以javascript方式解读。

再把函数Clicked写入script标签:

<script type="text/javascript">
function Clicked(){
}
</script>

④之后我们将点击后需要执行的动作写入到Clicked函数中。一般情况下,要记录一个按钮点击过与否,我们会声明一个变量,并对其以布尔值进行赋值。布尔值只有两种:true和false。比如我们将变量命名为clkBool,如果clkBool的值为false,则按钮未被点击,如果clkBool为True,则按钮已经点击过:

var clkBool=false;

这句话要写在Clicked函数外部,用于浏览器加载页面时,即立马定义clkBool值为false,而无关Clicked函数执行与否。然后点击之后,将clkBool赋值为True。

clkBool=true;

这句话要写在Clicked函数内部,仅当Clicked函数执行时(按钮点击时)才调用这句代码,则完整script标签如下:

<script type="text/javascript">
var clkBool=false;
function Clicked(){
clkBool=true;
}
</script>

⑤之后如果要查看按钮是否点击过,只需查看clkBool的值即可知道,如何查看的方式很多,比如点击另一个按钮,再通过另一段javascript来调用(javascript可以调用HTML,而HTML无法调用javascript),再比如直接将按钮上显示的文字改为已点击和未点击等等。我们设定另一个按钮来查看之前的按钮是否被点击过(双斜杠后的文字可以写入代码,但是作为标注,不会被执行):

<input type=" button" value="判断点击" onclick="CheckClk()"/>
<script type="text/javascript">
function CheckClk(){//定义函数CheckClk
if (clkBool) {
//用if判断clkBool的值,一般写作if(clkBool==true),但(clkBool==true)本身返回结果就是true和false,返回结果一定等于clkBool本身,所以可以这么写
alert("按钮已经点击过");//弹出警告框
}
else{//如果不满足if的条件
alert("按钮未被点击");//弹出警告框
}
}
</script>

⑥两个按钮及按钮对应的script标签合并,最终代码:

<input type="button" value="点击测试" onclick="Clicked()"/>
<input type=" button" value="判断点击" onclick="CheckClk()"/>
<script type="text/javascript">
var clkBool=false;
function Clicked(){
clkBool=true;
}
function CheckClk(){
if (clkBool) {
alert("按钮已经点击过");
}
else{
alert("按钮未被点击");
}
}
</script>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
adc大神fly
2017-05-03 · TA获得超过305个赞
知道答主
回答量:740
采纳率:0%
帮助的人:97.7万
展开全部
var old = false;

document.getElementById("button").onclick = function() {

if (old) {
alert("已经被点过了");
return false;
}
old = true;

}
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
ygh31500
2014-11-14 · TA获得超过158个赞
知道答主
回答量:118
采纳率:100%
帮助的人:124万
展开全部
var old = false;

document.getElementById("button").onclick = function() {

if (old) {
alert("已经被点过了");
return false;
}
old = true;

}
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式