0

一つ質問があります。<span>javascriptの追加で要素を削除することは可能ですか?

追加されたスパンを削除しようとすると、何も起こりません。

このような：

<script type="text/javascript">
$(document).ready(function(){
    $('#SelectBoxData span').click(function(){
        var StatusID = this.id;
        var StatusIDSplit = StatusID.split("_");
        var StatusText = $('#SelectBoxData #' + StatusID).text();

        $("#SelectBox").append('<span id=' + StatusID + '>' + StatusText + '</span>');
        $("#SelectBoxData #" + StatusID).remove();

        InputValue = $("#StatusID").val();
        if(InputValue == ""){
            $("#StatusID").val(StatusIDSplit[1]);
        }
        else{
            $("#StatusID").val($("#StatusID").val() + ',' + StatusIDSplit[1]);
        }
    });

    $('#SelectBox span').click(function(){
                var StatusID = this.id;
        $("#SelectBox #" + StatusID).remove();
    });
});
</script>

<div id="SelectBoxBG">
    <div id="SelectBox"><div class="SelectBoxBtn"></div></div>
    <div id="SelectBoxData">
        <span id="StatusData_1">Admin</span>
        <span id="StatusData_2">Editor</span>
        <span id="StatusData_4">Test 1</span>
        <span id="StatusData_6">Test 2</span>
    </div>
    <input type="hidden" id="StatusID" />
</div>

私を助けてください。

ありがとう。

4

1 に答える 1

3

はい、削除できます。clickただし、存在する前にイベント ハンドラーを追加することはできません。このコード:

$('#SelectBox span').click(function(){
    var StatusID = this.id;
    $("#SelectBox #" + StatusID).remove();
});

コードの実行時にのみ、要素にclickイベント ハンドラーを追加します (したがって、提供された HTML に基づいて、要素はありません)。イベント ハンドラーが動的に追加された要素に反応するようにしたい場合は、次の関数を使用して、event delegationと呼ばれる手法を使用する必要があります。<span>#SelectBox.on()

$('#SelectBox').on('click', 'span', function() {
    $(this).remove(); // equivalent to the code you had before
});
于 2013-04-08T08:59:49.397 に答える