の維持のための正しいJavascriptのイベント使用後のcloneNode(true)

StackOverflow https://stackoverflow.com/questions/29624

質問

私はform要素を含む複数行の入力できるモデルです。うそれぞれの線路属性としての新しいオブジェクトを作りたい私のサポートも組み込まれています。が、こういうことができるように複数作成する新たなオブジェクトに一つのHTTPます。私が使っているJavascriptのcloneNode(true)メソッドクローンします。問題は、それぞれの入力コンビニエンスストアも併設して削除リンクを取り付けonclickイベント:

// prototype based
<div class="input-line">
    <input .../>
    <a href="#" onclick="$(this).up().remove();"> Remove </a>
</div>

のクローニング入力ラインの削除リンクをクリックすると、ものを削除します入力ラインとしたクローンから同じdomオブジェクトです。ことはできrebind、"この"オブジェクトの適切なアンカータグの使用後cloneNode(true)のDOM要素かどうかが判別されます。

役に立ちましたか？

解決

だしハンドラの各リンク（こうべきは、ボタンを押すね).使用 バブリングイベント 取扱い すべての ボタン一つのハンドラ:

formObject.onclick = function(e)
{
    e=e||event; // IE sucks
    var target = e.target||e.srcElement; // and sucks again

    // target is the element that has been clicked
    if (target && target.className=='remove') 
    {
        target.parentNode.parentNode.removeChild(target.parentNode);
        return false; // stop event from bubbling elsewhere
    }
}

+

<div>
  <input…>
  <button type=button class=remove>Remove without JS handler!</button>
</div>

他のヒント

きくクローニングのinnerHTML方法、またはミックス:

var newItem = $(item).cloneNode(false);
newItem.innerHTML = $(item).innerHTML;

また:と思いcloneNodeないクローンのイベントに登録されaddEventListener.がIEのattachEventイベント は クローニングします。私が間違っています。

いたしましこIE7、FF3くことになってい期間が必要になりう。

ここでの私のテストスクリプト:

<div id="x">
    <div class="input-line" id="y">
        <input type="text">
        <a href="#" onclick="$(this).up().remove();"> Remove </a>
    </div>
</div>

<script>

$('x').appendChild($('y').cloneNode(true));
$('x').appendChild($('y').cloneNode(true));
$('x').appendChild($('y').cloneNode(true));

</script>

デバッグすることでこの問題は、私があなたを包み込むコード

$(this).up().remove()

function:

function _debugRemoveInputLine(this) {
    debugger;
    $(this).up().remove();
}

ることができます$(this)であ満足を追求し続けてまいります。場合でも返還を一つ以上のオブジェクト(複数行)、その違いを見ても、コードを作成する要素の利用cloneNode.ごきげんいかなる変更の要素(すなわちを変更するid属性)?

になっていた問題だけを記述するかを付け加えることも検討に独自のIdを発動要素を"線"要素になります。

最初の答えがすることから始まったのだ。

Pornelが暗黙的にこのクロスブラウザの枠組みagnosticます。

だ試していたんだけど、プこれらのダイナミックな状況です。

だjQueryを使う?この方法にクローンの素子のイベント: http://docs.jquery.com/Manipulation/clone#true

編集：メんだ試作品です。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top