Jquery - 将值附加到段落

时间:2014-03-25 00:26:18

标签: javascript php jquery

我有4组与click-bind事件绑定的数据。我正在尝试将每个组中包含的隐藏字段的值添加到页面后面的段落中,这样当从一个或多个数据组中单击复选框时,隐藏字段中的值将显示在段落区域中。

我也希望得到它,以便当取消选中该复选框时,它会删除段落中的值,但是现在我只是尝试在单击复选框时显示该值。

这是我尝试过的:

这是存储值的数据组中的隐藏字段:

<input id="servicename_<?php echo $i;?>" name="servicename_<?php echo $i;?>"
type="hidden" value="<?php echo $service->PRODUCT;?>"></input>

这是click-bind事件:

$('input[id^=ckNow_]').each(function(){
    $(this).bind('click',function(){
      if($(this).prop('checked'))
        {

var servicename = '#servicename_'+$(this).attr('value').split("_");

ServiceName += servicename;

$('#lblServiceName').append($(ServiceName));

编辑以添加每个组内的复选框:

<input type="checkbox" id="ckNow_<?php echo $i;?>" name="ckNow[<?php echo $i;?>]">
</input>

然后是段落文字:

<p id="lblServiceName">Service Name
<input type="hidden" id="servicename" value="0"></input>
</p>

我做错了什么,我该如何解决?所有回复都非常感谢,我对所有建议完全开放。谢谢。

1 个答案:

答案 0 :(得分:2)

尝试

<p id="lblServiceName">Service Name
    <span></span>
    <input type="hidden" id="servicename" value="0"></input>
</p>

然后

jQuery(function ($) {
    var $checks = $('.group-data input[name^="ckNow["]').change(function () {
        var vals = $checks.filter(':checked').map(function () {
            return $(this).closest('.group-data').find('input[id^=servicename_]').val()
        }).get();
        $('#lblServiceName span').text(vals.join(', '))
    })
})

演示:Fiddle