为什么我不能将一些html附加到所需的元素?

时间:2013-11-29 22:10:37

标签: javascript jquery jquery-mobile

我希望有人可以伸出援助之手,我一直试图通过.post插入一些代码使用jquery一切似乎工作正常但响应数据没有插入conhere div

HTML

<div class="ui-grid-a">
    <div class="ui-block-a main">
        <div data-role="fieldcontain">
            <input type="checkbox" value="1##2##2##1080|2" name="pro1" id="pro1" class="checkpro">
            <label for="pro1"> product description
            </label>
        </div>
    </div>
    <div class="ui-block-b side">
        <div class="conhere">
        </div>
    </div>
</div>

的javascript

$( document ).on( "change",".checkpro", function(event, ui) {
    var checkedpro = $(this).is(':checked')?1:0;
    if (checkedpro==1){
        var variable=$(this).val().split("##");
        $.post("product.php", h{row :contenedor[0],
                                mul : variable[1],
                                can : variable[2],
                            pri: variable[3],
                                id : variable[4]},
            function(data){
                $(this).parents(".ui-grid-a").find(".conhere").empty().append(data).trigger('create');
        });
else{
    $(this).parents(".ui-grid-a").find(".conhere").empty();
}

1 个答案:

答案 0 :(得分:2)

这个代码有两个问题:

$(this).parents(".ui-block-a").find(".conhere")...

第一个问题是.conhere中不存在.ui-block-a元素。它存在于.ui-block-b中。 (并且.ui-block-a.ui-block-b都在.ui-grid-a内。)find只会查看调用集合中元素的后代元素。

第二个问题是,this不再是$.post调用之外的内容。所以我们希望在我们关闭的变量中捕获它。

最后,在这种情况下,我会使用closest,而不是parents

$(this).closest(".ui-grid-a").find(".ui-block-b .conhere")...
// or
$(this).closest(".ui-grid-a").find(".conhere")...

结合以上内容:

$(document).on("change", ".checkpro", function (event, ui) {
    var $elm = $(this),                           // <== Remember $(this)
        checkedpro = $elm.is(':checked') ? 1 : 0;
    if (checkedpro == 1) {
        var variable = $elm.val().split("##");
        $.post("product.php", h {
                row: contenedor[0],
                mul: variable[1],
                can: variable[2],
                pri: variable[3],
                id: variable[4]
            },
            function (data) {
                // v-------------------------------- use it, and note 'closest'
                $elm.closest(".ui-grid-a").find(".conhere").empty().append(data).trigger('create');
            });
    } // <== This } was also missing
    else {
        $elm.closest(".ui-grid-a").find(".conhere").empty();
    }