0

明らかに私は何か間違ったことをしています。.click() を機能させることはできませんでしたが、他の jQuery 呼び出しは正常に機能します。

私は次のJavascript関数を持っています:

    function showParamsFor(divID) {
       //Code here works when the function is called through onclick attribute
    }

次に、基本的に次のシナリオがあります。

    int index = 0;
    foreach (var op in Model.Operations)
    {
       <div id="param_container[@(index)]"
          <a id="show_params[@(index)]" href="#">
             Edit Parameters
          </a>
       </div>
       index++;
    }

    int total = index;
    <script type="text/javascript" src="~/Scripts/jquery-1.6.2.min.js"></script>
    for (int i = 0; i < total; i++)
    {
        <script type="text/javascript">
            $(document).ready($('#show_params[@(i)]').click(function () {
                showParamsFor('#param_container[@(i)]');
            });
        </script>
    }

私の人生では、これを機能させることはできないようです。.click() 以外に、次のメソッドを使用してみました。

.live('click', function()) 
.bind('click', function())

各シナリオで $(document).ready を削除して再度追加しようとしましたが、リンクをクリックしても何も起こりません。

ID 名を再確認し、ID の代わりにリンクのクラス名 (.show_params[@(i)]) を使用してみました。ここで何が間違っていますか？

編集

これらのリンクの動的リストがあるため、ループを使用しています。各リンクは他の各リンクへの参照を必要とするため、すべてが作成された後、クリックイベントをそれぞれにバインドする必要があります。

4

3 に答える 3

2

css クラスを a タグに追加して、それを jQuery セレクターに使用してクリック機能をバインドできるようにします。

foreach (var op in Model.Operations)
{
   <div id="param_container[@(ViewBag.Index)]"
      <a id="show_params[@(ViewBag.index)]" href="#" class="thatClass">
         Edit Parameters
      </a>
   </div>
   ViewBag.Index++;
}

あなたのスクリプトは

$(function(){
  $(".thatClass").click(function(e){
     e.preventDefault()'; //if you want to prevent default behaviour
     var item=$(this);
     alert(item.attr("id");
     alert(item.parent().attr("id");

  });
});

これはうまくいくはずです

要素の ID を指定するために ViewBag アイテムを使用する理由がわかりません! .

ID (一意の値を提供する他のプロパティ) がある場合は、次のように使用することを検討する必要があります (IDコレクション内の各アイテムに一意の値を持つプロパティがあると仮定します)

foreach (var op in Model.Operations)
{
   <div id="param_container-@op.ID"
      <a id="show_params-@op.ID" href="#" class="thatClass">
         Edit Parameters
      </a>
   </div>       
}

私見、上記のコードはViewBagを使用したものよりもきれいに見えます

于 2012-07-06T20:29:23.980 に答える
0

回答ありがとうございますが、私は自分の問題を理解しました。

  1. 「param_container[@(i)]」を渡すべきだったのに、「#param_container[@(i)]」を showParamsFor 関数に渡していました。ハッシュタグなし。

  2. もっと重要な問題... ID の括弧が jQuery で認識されませんでした。\\ をブラケットの前のエスケープ文字として使用できると読みましたが、当然..それは私にとってはうまくいきませんでした。ID を「param_container[@(i)]」から「param_container-@(i)」に変更しました。

すべてがうまくいっているようです。これが私の最終的なスクリプトです：

    <script type="text/javascript" src="~/Scripts/jquery-1.6.2.min.js"></script>
    <script type="text/javascript">
        for (var i = 0; i < total; i++)
        {
            $(document).ready(function() {
               $('#show_params-'+i).live('click', function (data) {
                    showParamsFor('param_container-'+i);
                });
            });
        }
    </script>
于 2012-07-09T14:21:37.010 に答える
0

なぜここでカスタム ループを使用する必要があるのか​​ 、まだ理解できません。ここでは Jquery コードで十分です。まず、要素を追加します。次に、準備が整ったドキュメントは次のようになります。

        $(document).ready(function() {
            $('a[id^=link]').live('click', function(data) {
                alert($('#links').children().index(this));
            });
        });

UPD 小さなサンプルはこちら: http://jsbin.com/ahavel/2

于 2012-07-06T20:47:37.717 に答える