2013-02-16 64 views
0

我的問題:當我添加另一個文本輸入時,我無法顯示/隱藏它。不能使用顯示/隱藏

<html> 
<head> 

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://code.jquery.com/jquery-migrate-1.1.0.min.js"></script> 
<script src="http://code.jquery.com/jquery-1.8.3.js"></script> 
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script> 
<script> 

$(document).ready(function(){ 

     $(".slidingDiv").hide(); 
     $(".show_hide").show(); 

     $('.show_hide').click(function(){ 
     $(".slidingDiv").slideToggle(); 
     }); 

     $(".slidingDiv1").hide(); 
     $(".show_hide1").show(); 

     $('.show_hide1').click(function(){ 
     $(".slidingDiv1").slideToggle(); 
     }); 

}); 

var counter = 1; 
var limit = 3; 
function addInput(divName){ 

mainCanvasDiv = document.createElement("div"); 
mainCanvasDiv.className = "slidingDiv1"; 
mainCanvasDiv.style.display = "none"; 

var newdiv = document.createElement('div'); 
newdiv.id = "dynamicInput" + counter; 
      newdiv.innerHTML = "<a href='#' class='show_hide1'>Show/hide</a>"; 
      mainCanvasDiv.innerHTML = "Entry " + (counter + 1) + " <br><input type='text' name='dynamicInput" + counter +"1'><br><input type='text' name='dynamicInput" + counter +"2'>"; 
      document.getElementById(divName).appendChild(newdiv).appendChild(mainCanvasDiv); 
      counter++; 

} 
$(document).ready(function(){ 
    $('#sortable').sortable({ 
     update: function(event, ui) { 
var newOrder = $(this).sortable('toArray').toString(); 
      document.getElementById('sort').value = newOrder; 
     } 
    }); 
}); 


</script> 
</head> 
<body> 

<form action="lost.php" method="POST"> 
<div id="sortable"> 
<div id="dynamicInput"> 
<a href="#" class="show_hide">Show/hide</a> 
<div class="slidingDiv"> 
<input type="text" name="myInputs[]"> 

</div> 
</div> 
</div> 
<input type="button" value="Add another text input" onClick="addInput('sortable');"><br /> 
<input type="hidden" name="sort" id="sort" value=""> 
<input type=submit value="GO!"> 
</form> 
</body> 
</html> 

有什麼建議嗎?

更新:
我已經改變 $(」。show_hide1 ')點擊(函數(){ 到 $(' show_hide1' 。)上( 「點擊」, 「格a.show_hide1」。功能(){

也許我做錯了什麼,我不堅強的JS

+1

嘗試[的jsfiddle(http://jsfiddle.net/)而不是設置。更容易使用。 – 2013-02-16 20:43:18

+0

@JohnConde這裏:http://jsfiddle.net/aWhJQ/請不要說「改爲」,代碼需要在帖子中。 – 2013-02-16 20:43:58

+0

你爲什麼包括jQuery 1.8.3 AND 1.9.1? – j08691 2013-02-16 20:44:21

回答

0

取代點擊事件:

  $("#sortable").on("click","div a.show_hide", function() { 
       $(".slidingDiv").slideToggle(); 
      }); 

      $("#sortable").on("click","div a.show_hide1", function() { 
       $(".slidingDiv1").slideToggle(); 
      }); 
+0

完成,但現在不可排序 – user2079197 2013-02-16 21:14:24

+0

排序對我有用 http://jsfiddle.net/Yhp3c/ – 2013-02-18 09:06:26

2

修正:http://jsfiddle.net/Yhp3c/

您需要使用live代替click作爲live也是目標未來(閱讀:DOM腳本)元素。

編輯:如評論中所述:使用on代替live

+2

'live'已棄用,請使用'on'。 – loganfsmyth 2013-02-16 20:47:57

+0

請將相關的代碼添加到您的文章,jsfiddle不會加載我(這是痛苦的緩慢)。 – 2013-02-16 20:48:26

+1

'活'已被刪除在jquery 1.9 – Corneliu 2013-02-16 20:48:36