为什么jquery脚本不起作用？ [英] Why is the jquery script not working?

问题描述

为什么jQuery脚本在我的jsfiddle中工作但不在我的页面中？

Why is the jQuery script working in my jsfiddle but not in my page?

我做了什么：尝试了不同版本的JQuery ......制作了剧本

What I've done: Tried different versions of JQuery...made the script

所以我有此测试页：

   <!-- Scripts -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
           <style>

            select #canselect_code {
                width:200px;
                height:200px;
            }
            .fr {
                float:right;
            }
            .fl {
                float:left;
            }


        </style>

        <script>
$(document).ready(function(){
            $('[id^=\"btnRight\"]').click(function (e) {

    $(this).prev('select').find('option:selected').remove().appendTo('#isselect_code');

});

$('[id^=\"btnLeft\"]').click(function (e) {

    $(this).next('select').find('option:selected').remove().appendTo('#canselect_code');

});

});
        </script>


</head>

正文部分

Body Part

 <div>
    <select id='canselect_code' name='canselect_code' multiple class='fl'>
        <option value='1'>toto</option>
        <option value='2'>titi</option>
    </select>
    <input type='button' id='btnRight_code' value='  >  ' />
    <br>
    <input type='button' id='btnLeft_code' value='  <  ' />
    <select id='isselect_code' name='isselect_code' multiple class='fr'>
        <option value='3'>tata</option>
        <option value='4'>tutu</option>
    </select>
</div>

JSFIDDLE HERE

现在我的问题是：为什么代码在JsFiddle中工作但在我的文档中没有？

Now my question is: Why is the code working in JsFiddle but not in my document?

感谢您的回答！

编辑：添加文档就绪函数..仍然不起作用！

Added document ready function..still does not work!

推荐答案

Samuel Liew是对的。
有时jquery与其他jqueries冲突。
解决这个问题你需要把它们放在这样一个顺序，它们可能不会相互冲突。
做一件事：在谷歌浏览器中打开您的应用程序并检查右下角是否有红色标记错误。
哪种错误是什么？

Samuel Liew is right. sometimes jquery conflict with the other jqueries. to solve this problem you need to put them in such a order that they may not conflict with each other. do one thing: open your application in google chrome and inspect bottom right corner with red marked errors. which kind of error that is?

这篇关于为什么jquery脚本不起作用？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！