Javascript / JQuery Conflict



我是这方面的新手。我的页面上有两个javascript/jquery。如果我使用第一个脚本,第二个脚本不起作用。如果我删除第一个脚本,第二个脚本就可以了。我不知道如何解决这个问题。我知道有一个"没有冲突"的脚本。我试过了,但没有成功。我可能试错了方法。请有人帮我。我怎么能把他们两个都跑?我已经发布了以下两个脚本:

脚本编号1:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $(".sign_in").click(function(){
        $("#sign_box").show();
        return false;
    });
    $("body #headerwrap").click(function(){
        $("#sign_box").hide();
        return false;
    });
});
</script>

脚本编号:2

<script language="javascript" type="text/javascript">
var fieldstocheck = new Array();
fieldnames = new Array();
function checkform() {
    for (i=0;i<fieldstocheck.length;i++) {
        if (eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value")==""){
            alert("Please enter your "+fieldnames[i]);
            eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");
            return false;
        }
    }
    return true;
}
function addFieldToCheck(value,name) {
    fieldstocheck[fieldstocheck.length] = value;
    fieldnames[fieldnames.length] = name;
}
</script>

页面上的第二个脚本在哪里?它需要更多的信息来了解发生了什么。

第二个剧本看起来非常不祥,可能是非常古老的剧本。一些关注点:

  • 所有代码都被抛出到全局对象
  • 未声明字段名(缺少var)
  • 使用[]声明数组是新array()语法的首选项
  • addFieldToCheck和checkform函数似乎没有使用(至少在您发布的代码中没有使用)
  • 它使用eval,这被认为是一种糟糕的做法

为了有一个好的开始,请尝试将第二个函数包装在自调用匿名函数中:

(function() {
  var fieldstocheck = [],
    fieldnames = [];
  function checkform() {
    //... 
  }
}());

只是关于eval的一个注释。你不需要像现在这样使用eval。你可以直接使用括号符号:

eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value")

与相同

document.subscribeform.elements[fieldstocheck[i]].value

eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");

与相同

document.subscribeform.elements[fieldstocheck[i]].focus();

没有冲突。

第一个脚本有一个返回false的点击侦听器。我假设登录按钮是用来提交表格的。

在该点击事件上返回false将阻止表单提交,这意味着执行路径将永远不会在第二个脚本中输入您的函数。

请考虑删除返回false。

编辑:以下是一些关于为什么返回false通常是不好的做法的更多信息(除非你确切地知道你在做什么以及为什么)

http://firebreaksice.com/avoid-return-false-in-jquery-click-bindings/

最新更新