2016-10-03 72 views
1

我有兩個div包含相同的複選框,具有相同的名稱,類和id。當我選擇特定div的複選框時,它應該在提交按鈕時提醒該複選框的值。如何在提交按鈕時檢查特定複選框的值?

例子:

<div> 

    <input type="checkbox" class="snowplay" id="snowplayy" name="snowplay" value="1"> 
</div> 
<div> 

    <input type="checkbox" class="snowplay" id="snowplayy" name="snowplay" value="2"> 
</div> 
<div> 

    <input type="submit" class="submit" id="submit" name="submit" /> 
</div> 

當我點擊任何兩個複選框,然後提交按鈕,我想提醒的是特定的複選框的複選框的值。任何人都可以說如何做到這一點?

+2

'ID應該是唯一的' – guradio

回答

1

$('.submit').click(function(e) { 
 
    e.preventDefault() 
 
    //alert($('.snowplay:checked').val()) //single value 
 
    $('.snowplay:checked').each(function() {//iterate over 
 
    alert($(this).val()) // many value 
 

 
    }) 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 

 
    <input type="checkbox" class="snowplay" id="snowplayy" name="snowplay" value="1"> 
 
</div> 
 
<div> 
 

 
    <input type="checkbox" class="snowplay" id="snowplayy1" name="snowplay" value="2"> 
 

 
</div> 
 

 
<div> 
 

 
    <input type="submit" class="submit" id="submit" name="submit" /> 
 

 
</div>

  1. 使用此.snowplay:checked複選框帶班snowplay被檢查
  2. 更改您的ID是唯一的
0

ID必須是唯一的。所以在這裏我刪除了id屬性:)。

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
$('#submit').click(function(){ 
$('.snowplay:checked').each(function(){ 
alert($(this).val()) 
}); 

}); 

}); 
</script> 
</head> 
<body> 
<div> 

    <input type="checkbox" class="snowplay" name="snowplay" value="1"> 
</div> 
<div> 

    <input type="checkbox" class="snowplay" name="snowplay" value="2"> 
</div> 
<div> 

    <input type="submit" class="submit" id="submit" name="submit" /> 
</div> 

</body> 
</html>