0

これが私のコードです：

<input type = checkbox id = "kinch" name = "link" > Bunz </input>
<div id = bootypipe></div>

JavaScriptは次のとおりです。

$("#kinch").click(function(){

    if ($("#kinch").is(":checked")) {

        //Add image to div bootypipe
         $("#bootypipe").append("<image id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'>HA!</image>");

    } else {


        $("#chink").remove();

    }
});

これがjsfiddleです：http：//jsfiddle.net/shrimpboyho/wUu34/13/

画像は削除されて追加されますが、画像を削除してもテキストHa!は残り、時間の経過とともに蓄積されます。どうすればこれを削除できますか？

4

4 に答える 4

2

テキストではなく画像タグのみを削除するためです。あなたはこのようにすることができます

画像とテキストを 1 つの div で囲み、次のように div タグを削除します

$("#kinch").click(function(){

    if ($("#kinch").is(":checked")) {

        //Add image to div bootypipe
         $("#bootypipe").append("<div id='chink_outer'><img id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'/>HA!</div>");

    } else {


        $("#chink_outer").remove();

    }
});

デモ

于 2013-01-30T04:15:49.097 に答える
2

あなたはただできませんか：

$("#bootypipe").empty();

画像を削除する代わりに。

于 2013-01-30T04:16:52.957 に答える
1 
<image id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'>HA!</image>

無効な HTML マークアップです。要素に実際にテキストを含めることはできません。そして、正しいタグは<img>. 私はそれが実際に次のように解釈されていると思います

<img id='chink' src='...' > HA!

つまり、テキストは要素の一部ではなく、一緒に削除されません。

を実行する代わりに、$('#chink').remove()追加し$('#bootypipe').empty()たものをすべて削除します。

于 2013-01-30T04:13:47.573 に答える
1

要素はorの<img>ように自己終了します (別の回答で述べたように、デモ コードは無効です)。<br><hr>

ただし、画像の周りにラッパー ( <p>、<span>、 ) を含めるだけで、コードは機能します。<div>次に、ラッパー (つまり$('p').remove();) を削除します。追加の ID、クラスを追加しないでください (#kinch の周りに既に関数を作成しています。なぜコードに追加するのですか?)。ラッパーをターゲットにするだけです。$('#chink').parent().remove();も機能し、どの要素が親であるかに偏りはありません。

$("#kinch").click(function(){
    if ($("#kinch").is(":checked")) {
        $("#bootypipe").append("<p><image id = 'chink' src = '...'>HA!</p>");
    } else {
        $('p').remove();
        // or $('#chink').parent().remove(); // pick your poison
    }
});
于 2013-01-30T04:28:25.050 に答える