0

コンテナー ドキュメントで発生するイベント ハンドラーがあり、それを内部の li-Element に伝達します。なんらかの理由で、Return キーを押すと、DOM ツリーの少し上にあるリンクに対してもイベントが発生します。イベントが DOM をバブリングするのを止めることができませんでした。その理由はわかりません。誰でも助けることができますか？ありがとう。

私はjQuery 1.7を使用していますが、残念ながら、その複雑さのために意味のあるライブコード例を提供することはできません... :-(

私のHTMLは次のようなものです：

<div id="contentBox">

    <form [...]>

        <a class="del" href="javascript:[...]">Delete entry</a>

        <fieldset>
            <legend>An entry</legend>

            <input name="xy" class="lmti">

            <ul>
                <li>Result 1</li>
                <li>Result 2</li>
                <li>Result ...</li>
            </ul>
        </fieldset>

    </form>

</div>

私のJavascriptの一部は次のようになります。

$('#contentBox').on('click', '.del', function(e) { [...deletes an entry...] });

と

$('#contentBox').on('keyup', '.lmti', function (e) { [...takes over search results...] });

何が起こるかは次のとおりです。

#contentBoxのコンテンツはajax を使用して動的に読み込まれます。そこには要素のリストがあり、動的に展開できます。新しい要素を追加するたびに、フィールドセット内のすべてのタグのセットが追加されています。横にあるリンクclass="del"を使用して要素を削除できます。ユーザーが入力ボックスに入力すると、その下にライブ検索ボックスが表示されるので、そこからエントリを引き継ぐことができます。これは、下向き矢印を押して検索結果を確認し、Returnキーを押して結果を引き継ぐことによっても実行できます。

上記のイベント内で、押されたreturnをチェックし、実際にタイトルのリストからタイトルを取得して HTML 入力フィールドに入力します。グーグルライブ検索のように。

問題:リターンを押して結果セットを引き継ぐと、上記のイベントが削除リンクのクリック イベント ハンドラに対しても発生します。

e.stopPropagation、e.stopImmediatePropagation、e.preventDefault()などを組み合わせても伝播を停止できませんでした。

delete-link event-handler 内の event-target をチェックすると、エントリの削除が停止することがわかりました。しかし、イベントがa -click イベントに到達しないことを望みます。

%-/

何か案は？

4

2 に答える 2

1

jQuery を使ってみましたevent.stopPropagation();か?

これを使ってみてください: 

event.stopPropagation();

一緒に：

event.bubbles = false;

魅力のように機能します.....

于 2012-09-28T15:47:18.043 に答える