目录
JavaScript:void(0)
我们在编程时,经常会出现javaScript:viod(0)
。
这是标签a的调用函数void(0),而调用它有什么用呢?
javascript:viod(express)
,这express可以是任何信息,比如js函数,常量等。但括号内必须有表达式,假如是void()
,编辑器就会报错:expression expected
,如图所示:
因而,我们需要在javascript:viod(express)
设置表达式,既然说到了 javaScript:viod(0)
,我们就来分析它,在分析它之前,我们先看一段脚本代码:
<a href="../计算器联系.html" id="testc" onclick="javascript:testc(this.id);">测试无javascript:void(0)</a> <!--语句1-->
<a href="javascript:void(0)" id="testd" onclick="javascript:testc(this.id);">测试有javascript:void(0)</a> <!--语句2-->
<form method="post" action="#">
<input type="text" id="txt" />
</form>
<!--这是上述方法的script脚本-->
<script type="text/javascript">
function testc(objId){
var val=$("#txt").val();
if(val!=""){
$("#"+objId).attr("href","../计算器联系.html");
return true;
}else{
alert("文本框不能为空;");
return false;
}
}
</script>
ps:“javascript:”是 JavaScript 标准的表达式
分析语句1
对于语句1来说,不论是返回的结果是true还是false,其都能跳转的制定的页面。
因而,这和我们最初的想法是不一致。
我们最初的想法,一开始不跳转,当条件成立时,其才跳转指定的页面。
分析语句2
对于语句2来说,首先javaScript:viod(0)
是一个死循环,当用户点击testd时,其不会发生任何任何改变,但它如果符合某个条件时,testd就跟着发生改变了。
也就是说,如果条件为真时,就跳转到指定的页面,这就符合我们的想法了。
这也是javaScript:viod(0)
的神奇之处。因而,我们可以利用javaScript:viod(0)这种操作,进行ajax、判断等一些操作。
JavaScript:void(0)和#
JavaScript:void(0)
和#
功能相似,一开始并不执行任何操作,当等到条件满足使,才会触发某个事件或函数,他们具体的区别在哪里呢?我们来看一段代码:
<form method="post" action="#">
<input type="text" id="txt" />
<input type="submit" value="测试javascript" onclick="return sub();return false;"/>
</form>
<br />
<hr />
javascript:void(0)和#
<a href="javascript:void(0)" id="testd" onclick="javascript:testc(this.id);">测试有javascript:void(0)</a> <!--语句1-->
<a href="#" id="teste" onclick="javascript:testc(this.id);">测试#</a> <!--语句2-->
<!--这是上述方法的script脚本-->
<script type="text/javascript">
function testc(objId){
var val=$("#txt").val();
if(val!=""){
$("#"+objId).attr("href","../计算器联系.html");
return true;
}else{
return false;
}
}
</script>
分析语句1
对于语句1来说,已经在上面讲述清楚了
分析语句2
我们使用了#
,当该代码执行时,#
会被优化成#top
,也就是说,会默认生成一个top锚点。当添加不成立时,它会回滚到该页面的最上层,当条件成立时,它会会执行某个事件或跳抓到指定的页面。
javascript:void(0)和javascript:;
javascript:void(0)
和javascript:;
具有相同的功能,因而,我们有时会把javascript:void(0)
写成javascript:;
,如代码所示
<a href="javascript:;" id="testd" onclick="javascript:testc(this.id);">测试有javascript:void(0)</a> <!--语句2-->
<form method="post" action="#">
<input type="text" id="txt" />
</form>
<script src="jquery-3.4.1.js"></script>
<!--这是上述方法的script脚本-->
<script type="text/javascript">
function testc(objId){
var val=$("#txt").val();
if(val!=""){
$("#"+objId).attr("href","../计算器联系.html");
return true;
}else{
alert("文本框不能为空;");
return false;
}
}
</script>
结论
至此,你可能对#和JavaScript:void(0)有了初步的了解,我们也由此得到了两个结论。
结论1
为什么有的页面很长,我们在点击某个链接时,却跳转到了页眉的地方?因为内部使用了#。然而,javascript:void(0)
则不是如此,所以调用脚本时最好用javascript:void(0)
或者javascript:;
。
结论2
如果我们想利用表前a
进行ajax操作时,最后使用javascript:void(0)
或者javascript:;
。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/99296.html