[英]jquery function stops working after adding div
K我有一些問題。 我需要使以下工作。 我是jquery / php的新手,但是我將其拖放到sortable-list中。 但是以下內容不起作用。.之前的“組”稱為“小隊”。 通話如下
echo "<p><input type=\"submit\" class=\"input-button\" id=\"btn-add\" value=\"Add Squad\" /></p>";
然后我將函數寫為:
$(function(){
var count = 2;
$('#btn-add').click(function(){
if(count == 5){
$('.groupA').append('<div class="groupB"><div class="column left" style="color: darkorange;"><input type="text" name="S' +count+ '" value="Squad ' +count+ '" style="text-align: center; width:151;"></center><ul class="sortable-list"></ul></div>');
if(count > 11){
$('#btn-add').hide();
}
} else if(count == 9){
$('.groupB').append('<div class="groupC"><div class="column left" style="color: darkorange;"><input type="text" name="S' +count+ '" value="Squad ' +count+ '" style="text-align: center; width:151;"></center><ul class="sortable-list"></ul></div>');
}else {
if(count > 11){
$('#btn-add').hide();
}
if (count > 9)
$('.groupC').append('<div class="column left" style="color: darkorange;"><input type="text" name="S' +count+ '" value="Squad ' +count+ '" style="text-align: center; width:151;"></center><ul class="sortable-list"></ul></div>');
else if (count > 4)
$('.groupB').append('<div class="column left" style="color: darkorange;"><input type="text" name="S' +count+ '" value="Squad ' +count+ '" style="text-align: center; width:151;"></center><ul class="sortable-list"></ul></div>');
else
$('.groupA').append('<div class="column left" style="color: darkorange;"><input type="text" name="S' +count+ '" value="Squad ' +count+ '" style="text-align: center; width:151;"></center><ul class="sortable-list"></ul></div>');
}
count++;
});
});
現在,當Felix解決了我的第一個問題時,我已經對其進行了編輯,但是現在我修復了div,所有的拖放操作都不再起作用。 我已經通過php手動將其放進去,並且拖放操作適用於該容器,但是使用添加按鈕創建的容器不起作用。 我想念什么?
任何幫助表示贊賞。
嘗試在此處使用事件委托 :
$(function(){
var count = 1;
$('body').on('click','#btn-add', function() {
// Your code here
});
});
您還需要使用$('.groups')
代替$('groups')
我沒有找到解決jquery拖放問題的方法。 添加DIV之后。 然而。 我發現,如果我添加了所有div並將其全部隱藏,然后使用jquery按鈕取消隱藏它們。 這確實有效,並且沒有更多的錯誤/問題。 我希望這可以幫助其他人尋找相同的答案。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.