0

即使我在 中加载了 jquery，我的代码也没有响应。但我的 JSfiddle 工作正常。请帮助我我在哪里失踪。Firefox 控制台上没有发现错误。我无法弄清楚我在哪里失踪。我对 js 和 jquery JS 小提琴设置非常陌生，位于http://jsfiddle.net/3Wdr3/1/

    <html>
<head>
 <link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> 
</head>
<body>
<script type="text/javascript">

var counter = 2;
var availableTags = [
 "ActionScript",
 "AppleScript",
 "Asp",
 "BASIC",
 "C",
 "C++",
 "Clojure",
 "COBOL",
 "ColdFusion",
 "Erlang",
 "Fortran",
 "Groovy",
 "Haskell",
 "Java",
 "JavaScript",
 "Lisp",
 "Perl",
 "PHP",
 "Python",
 "Ruby",
 "Scala",
 "Scheme"];
$("#addButton").click(function () {
 var newTextBoxDiv = $(document.createElement('div'))
  .attr("id", 'TextBoxDiv' + counter);

 var roleInput = $('<input/>',{
  type:'text',
  placeholder:'Role',
  name:'Role'+counter,
  id:'textbox' + counter
 });

 var searchInput = $('<input/>',{
  type:'text',
  placeholder:'search',
  name:'search'+counter,
  id:'se' + counter
 });

 var hidd=$('<input/>',{
  type:'hidden',
  name:'searchhid'+counter,
  id:'searchhid' + counter
 });


 newTextBoxDiv.append(roleInput).append(searchInput).append(hidd);
 newTextBoxDiv.appendTo("#TextBoxesGroup");
 $('#se' + counter).autocomplete({
  source: availableTags
 });
 counter++;
});
</script>
<div id='TextBoxesGroup'>
 <div id="TextBoxDiv1" class="form-inline control-group">
  <input type='button' value='Add' id='addButton' />
 </div>
</div>
</body>
</html>
4

2 回答 2

4

确保在 dom 就绪状态下包装对 jQuery 的调用。

$(function() {
   $("#addButton")...
});

JSFiddle 会为你做这件事。

这很重要，因为其他元素还没有在 dom 中。因此，当您尝试使用 jQuery 选择它们时，它们不存在并且您的脚本将无法工作。

于 2013-11-13T12:08:45.947 回答
0

看到这个plunker你可能会明白为什么 dom ready 事件是必要的

$(文档).ready(函数(){

//your js code

});

在框架扩展左侧的小提琴中，您可以看到它设置为 onLoad 自动执行操作

于 2013-11-13T12:19:41.697 回答