想要为每个元素提供不同的ID

Question

我想在值中添加HTML标记。 http://jsfiddle.net/iamakshay04/seyzta8c/1/

上面是小提琴。单击复选框时，将打印值，我想将每个值打印为不同的html元素。 <p>1</p> <p>2</p> <p>3</p>

$('.ads_Checkbox').click(function() {
    var sel = $('input[type=checkbox]:checked').map(function(_, el) {
        return $(el).val();
    }).get();
    
    document.getElementById("demo").innerHTML = sel;
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input  id="ad_Checkbox1" class="ads_Checkbox" type="checkbox" value="1" />
<input  id="ad_Checkbox2" class="ads_Checkbox" type="checkbox" value="2" />
<input  id="ad_Checkbox3" class="ads_Checkbox" type="checkbox" value="3" />
<input  id="ad_Checkbox4" class="ads_Checkbox" type="checkbox" value="4" />
<input type="button" id="save_value" name="save_value" value="Save" />

<p id="demo">

</p>

Answer 1

这将为您提供不同的元素： -

$('.ads_Checkbox').change(function() {
    var sel = $('input[type=checkbox]:checked').map(function(_, el) {
        return $('<p></p>').html($(el).val());
    }).get();
    
    $("#demo").html(sel);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input  id="ad_Checkbox1" class="ads_Checkbox" type="checkbox" value="1" />
<input  id="ad_Checkbox2" class="ads_Checkbox" type="checkbox" value="2" />
<input  id="ad_Checkbox3" class="ads_Checkbox" type="checkbox" value="3" />
<input  id="ad_Checkbox4" class="ads_Checkbox" type="checkbox" value="4" />
<input type="button" id="save_value" name="save_value" value="Save" />

<p id="demo">

</p>

Answer 2

如果您想将值显示为不同的元素，请尝试下面的位置，您可以在读取值时添加段落。

$('.ads_Checkbox').click(function() {
    var sel = $('input[type=checkbox]:checked').map(function(_, el) {
        return "<p>"+ $(el).val() + "</p>";
    }).get();
    
    document.getElementById("demo").innerHTML = sel;
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input  id="ad_Checkbox1" class="ads_Checkbox" type="checkbox" value="1" />
<input  id="ad_Checkbox2" class="ads_Checkbox" type="checkbox" value="2" />
<input  id="ad_Checkbox3" class="ads_Checkbox" type="checkbox" value="3" />
<input  id="ad_Checkbox4" class="ads_Checkbox" type="checkbox" value="4" />
<input type="button" id="save_value" name="save_value" value="Save" />

<p id="demo">

</p>