動態生成的複選框無法檢查

我試圖檢查/取消選中動態生成的複選框。但我無法這樣做。我想要做的是 - 說，我有5個複選框，單擊第5個複選框，前4也應該檢查。以下是代碼：動態生成的複選框無法檢查

function checkImages(id) { 
    if ($('#' + id).is(":checked")) { 
     for (i = parseInt(id) ; i >= 0; i--) {   
      $("#" + id).attr("checked", true); 
     } 
    } else { 
     $(".selectedImages").prop("checked", false); 
    } 
}

HTML：

@for (int i = 0; i < Model.ImageList.Count; i++) 
{ 
    <div id="id @i" style=" margin:10px; float:left; height:100px; overflow:hidden; width:100px;"> 
     <input type="checkbox" [email protected] name="selectedImages" value="Weekly" onclick="checkImages(id);"> 
    </div> 
}

這裏你可以看到ID = 「2」被選中，但ID = 「1」沒有任何檢查屬性

來源

2016-03-05 Tarun Ohri

你爲什麼'attr（..，true）'但是prop（..，false）'？ –

也許：'onclick =「checkImages（@id）」'？在你的checkImages函數中加入：alert（id）來查看你傳遞的內容。 –

我做了第一次，但它沒有工作，然後我用attr ..它也不工作。 –

有你的代碼許多問題，主要的一個：

$("#" + id).attr("checked", true);

應該

$("#" + i).prop("checked", true);

和清除代碼：

$(".selectedImages").prop("checked", false);

選擇通過班，但你的元素有name=selectedImages所以應該是：

<input type="checkbox" id="@i" class="selectedImages" ...

最後，你的循環變爲0，但第一個元素是1（小問題）。

假設你onclick=代碼傳遞正確的值，這裏是更新的代碼

樣本HTML

<input type="checkbox" id="1" class="selectedImages" value="Weekly" onclick="checkImages('1');"> 
<input type="checkbox" id="2" class="selectedImages" value="Weekly" onclick="checkImages('2');"> 
<input type="checkbox" id="3" class="selectedImages" value="Weekly" onclick="checkImages('3');">

的jQuery：

function checkImages(id) { 
    if ($('#' + id).is(":checked")) { 
     for (i = parseInt(id) ; i >= 1; i--) {   
      $("#" + i).prop("checked", true); 
     } 
    } else { 
     $(".selectedImages").prop("checked", false); 
    } 
}

例codepen：http://codepen.io/anon/pen/BKoGaq

然而，這將是我的疏忽不提，你不應該使用數字ID這樣來 - 而不是使用data-屬性，如：

HTML：

<input type="checkbox" data-id="1" class="selectedImages" value="Weekly" onclick="checkImages(this);"> 
<input type="checkbox" data-id="2" class="selectedImages" value="Weekly" onclick="checkImages(this);"> 
<input type="checkbox" data-id="3" class="selectedImages" value="Weekly" onclick="checkImages(this);">

jQuery的

function checkImages(el) { 
    id = $(el).data("id"); 
    console.log(id) 
    if ($(el).is(":checked")) { 
     for (i = parseInt(id) ; i >= 1; i--) {   
      $(".selectedImages[data-id='" + i + "']").prop("checked", true); 
     } 
    } else { 
     $(".selectedImages").prop("checked", false); 
    } 
}

你也可以使用jquery事件處理程序而不是「onclick」。

來源

2016-03-05 16:08:34

動態生成的複選框無法檢查

回答

相關問題