Question

使用以下HTML，我试图将下面div下面的复选框设置为选中。

HTML：

<div id="69" class="activateUiHTML" data-role="collapsible">
    <div class="prd-items-detials">
        <ul>
            <li class="head">
                <form>
                    <input type="checkbox" class="checkboxclas" name="checkbox-mini-0" id="69" data-mini="true" id_attr="69" />
                    <label item_id_itr_some="69" class="testtt" for="checkbox-mini-0">Cold Tea, Fresh Chai gold Ice</label> 
                    <i class="delete-item-btn"></i> 
                </form>
            </li>
            <li class="prd-items-qt">
                <div class="col"> 
                    <span class="prd-sm-img">                         
                        <img id="imagesd" type="img" height="40" width="40" src="http://192.168.2.46:8080/OrderSnacks/JSON_images/icecream_cup_vanilla.jpg" />                         
                        <span></span>
                    </span>
                </div>
                <div class="col"> 
                    <i class="minus" id_attr="69"></i>  
                    <i class="qt qt_69" id_attr="69">1</i>  
                    <i class="plus" id_attr="69"></i> 
                </div>
                <div class="col"> 
                    <a style="display:block" id="69" vendor_items_id="83" class="btn btn-sm topp" data-count="2">Topping  <span>2</span>
                    </a> 
                </div>
                <div class="price" style="display:none;">75</div>
                <div class="col total total-rs total_69" id_attr="69">785</div>
            </li>
        </ul>
    </div>
</div>

使用Javascript：

var activehtml = $("#addtoordersdiv" + v_item_id).html();
var buildcart = $('<div id="' + v_item_id + '" class="activateUiHTML"  data-role="collapsible">');
buildcart.append(activehtml);
$('#' + v_item_id + '.activateUiHTML').find(".checkboxclas").prop('checked', true);

这不能按预期工作。
但是同一段代码：

var v_item_id = 69;
$('#' + v_item_id + '.activateUiHTML').find(".checkboxclas").prop('checked', true);

在浏览器控制台中测试时工作正常。

Answer 1

这有效

var v_item_id = 69 ;
    $('#'+v_item_id+'.activateUiHTML').find(".checkboxclas").prop('checked',true);

因为您在设置复选框的checked属性之前已在其中指定了v_item_id的值，如

中所示

var activehtml = $("#addtoordersdiv"+v_item_id).html();
var buildcart = $('<div id="' + v_item_id + '" class="activateUiHTML"  data-role="collapsible">');
buildcart.append(activehtml);
$('#'+v_item_id+'.activateUiHTML').find(".checkboxclas").prop('checked',true);

它在控制台中显示错误消息v_item_id is not defined。因此它不起作用。

Answer 2

您的代码没有document.ready。将此行添加到您的代码中：

$(document).ready(function(){
  var v_item_id = 69 ;
    $('#'+v_item_id+'.activateUiHTML').find(".checkboxclas").prop('checked',true);  
});

演示：http://plnkr.co/edit/ShVU7GVBDxBvN2tMDXh5?p=preview

无法在div中设置复选框类

2 个答案: