`
花花人
  • 浏览: 66325 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

触发事件name与javascript函数名同名

触发事件name与javascript函数名同名 
阅读更多

转载：触发事件name与javascript函数名同名，form提交问题

<script></script>标签：

it

 分类： JavaScript&CSS&Ajax

<!-- 正文开始 -->

今天遇到一个比较诡异的问题，曾浪费了我好一会时间，现在终于搞定，回头看起来真是屁松的一件事:

  1. <form id="myForm">  
  2.      <input  type="submit" name="submit" value="commit">  
  3.      <input type="button"  name="saveInfo" onclick="save()">  
  4. </form>  

调用的js脚本为：

  1. function save(){   
  2.     if (!checkInput()) return;   
  3.     document.myForm.target='_top';   
  4.     document.myForm.action='newUri.do';   
  5.     document.myForm.submit();   
  6. }   
  7.   
  8. function checkInput(){   
  9.    return true;   
  10. }  
程序在执行到document.myForm.submit()的时候总是报对象不支持此属性…………，
baidu一下后发现，原来是<input type="submit" name="submit">所致，修改name="submit"为其他名字后问题解决…………
 
 
  类似的问题还有：
  1.      <input  type="button" name="exit" value="退出" onclick="exit()">  

 

   这种情况下click事件也不能触发，页面上也会报同样的错误（对象不支持此属性），解决方法同上，修改name="exit"或onclick="exit()"为其他名字

http://blog.sina.com.cn/s/blog_53345e4c0100ba3d.html

 

 

为什么表单的提交回调函数不能以 "submit" 作为函数名？

源代码如下：

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript">
    function submit(s){
        alert(s)
        return false;
    }
    </script>
</head>
<body>
    <form action="" onsubmit="return submit(1);">
        <div class="row"><label>ID:<input type="text" /></label></div>
        <div class="row"><input type="submit" value="查询" /></div>
    </form>
</body>
</html>

你可以直接把上面的代码粘贴到html文件里运行。

操作如下：在ID里输入任意字符串，然后单击按钮。

预期效果：弹出一个弹出框，页面不刷新（你刚刚填的字符串还在那才对）。

实际效果：没有弹出框，页面刷新了。就好像不存在submit()这个方法一样。

解决办法：把submit()重命名为submit1()（或其他的什么名字），就能达到预期效果。

请问：What the fuck? 为什么会这样？

——————————————————————————————————————————————————

这里给出贺师俊的解答：

受邀回答。 

你的代码里绑定事件处理器的部分是这样写的： 
<form onsubmit="return submit(1);"> 
问题就在于这里。 

由于历史原因，在onxxx的属性中直接书写的代码，其context首先是该元素自身（效果上类似于 with (this) { ...你的代码... } ）。而form元素自身就有submit()方法。因此你的代码实际调用的是form.submit()，而不是你之前声明的submit函数。 

解决方法很简单，改成： 
<form onsubmit="return window.submit(1);"> 
即可。 


或者不用onxxx属性，而是直接用脚本绑定： 
<script> 
document.forms[0].onsubmit = function() { return submit(1) } 
</script>

—————————————————————————————

分享到：
| SQL SERVER中的sys.objects和sysobjects的 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics