0

の形式でインライン JavaScript を持つ古いテーブルを変更しています<a href="javascript:<lots of shit>">。インライン JavaScript は機能しますが、外部要素がクリックされたときにインライン JavaScript を実行する必要があるという私の割り当てに合うように書き直すには数か月かかります。

意味をなさない場合は申し訳ありませんが、fiddleを提供するのと同じくらい思慮深くなっています。(テーブルの側面は問題ではありません。) TL;DR: 色付きdivの の 1 つをクリックすると、その内部alert()を実行したいのですが、どうすればよいですか?

編集。また、リンクは実際には非表示になっています。

#2 を編集します。そして、今のところ、HTML を改ざんするべきではありません。jQuery/JavaScript のみ。

#3 を編集します。テーブルで動作するようにスクリプトを更新しました。インナー<span>は不要になりましたので、<a>直接お選びいただけます。今、私はstopPropagation()正しく使用しているかどうかを知りたいですか?

コード:

$(function () {
    $('table.result-v2 tr.view').bind('click', function () {
        var $this = $(this),
            $next = $this.next();

        if ($next.attr('class') == 'detail') {
            var $buttons = $this.find('td.buttons'),
                $link = null;

            if ($next.css('display') == 'none') {
                $link = $buttons.find('a.show-link');
            } else {
                $link = $buttons.find('a.hide-link');
            }

            if ($link != null) {
                eval($link.attr('href')); // evaluate found link
                $link.bind('click', function (event) {
                    event.stopPropagation(); // is this needed when the link never can be clicked (it's hidden)?
                });
            }
        }
    });
});
4

3 に答える 3

2

これは、コードを機能させる簡単なハックです。そして、これは絶対に行うべき方法ではないことに注意してください!

http://jsfiddle.net/2QaUX/1/

クリックをトリガーする代わりに、href 属性内のインライン スクリプトを評価します。

年:

$(function () {
    $('.foo').bind('click', function () {
        $(this).find('.bar').parent().trigger('click');
    });
});​

新しい:

$(function () {
    $('.foo').bind('click', function () {
        eval($(this).find('.bar').parent().attr('href'));
    });
    $('.bar').parent().bind('click', function (event) {
        event.stopPropagation(); 
    });
});​
于 2012-08-29T13:24:09.437 に答える
1

そのjsを関数内に配置するだけです

function clikEvent(ele)
{
 //<lots of shit>
}

onclickで呼び出して、href jsをvoidのように置き換えます

<a  href="javascript:void(0)" onClick='clikEvent(this)'> 

渡されたデータにも注意を払う必要があります。href を指すパラメーター ele を配置したので、jQuery を使用する場合は、ID またはその他のものを取得できます。

$('#idofAtag').click(function(){//<lots of shit>});
于 2012-08-29T13:23:45.817 に答える
1

ここには 2 つの問題があります。1 つはイベントの伝播です。div をクリックすると、リンクのクリックがトリガーされます。これは、div のクリックでもあります。これにより、最大コール スタック サイズをすぐに超える無限ループが作成されます。これを回避するには、次の 2 つのことを行う必要があります。

  1. ユーザーがその中の ではなく をwindow.location.hrefクリックした場合にのみ、割り当てを実行します。diva
  2. ユーザーが をクリックした場合a、イベントがdiv

href2 つ目の問題は、リンクの「クリック」イベントが、属性に格納されている JavaScript を実行しないことです。やりたいことは決まっていますwindow.location.href

$('.foo').on('click', function (e) {
    var link =  $(this).find('.bar').parent('a');
    if(e.target != link.get(0)) {
        window.location.href = link.attr('href');
    }
});
$('.foo').on('click', 'a', function(e) {
    e.stopPropagation();
});

ここにデモがあります

--- jsFiddle デモ ---

- 注 - この状況を処理する別の方法を見つけることを強くお勧めしますが、既存のリンクを変更できない場合は、このオプションが実行可能です。

于 2012-08-29T13:34:23.113 に答える