2

私はデータテーブルを構築しており、データベースに合計レコードを設定することで、それらの合計数を取得しています。

今、JavaScript のクリック イベントについて少し混乱しています。これは私がこれをやっている方法です：

 for (var cnt = pageno; cnt < pageno + 5; cnt++) {
                $("#newList").append('<li id="pageno" value=""' + cnt + ' onclick="GetPageno();" > ' + cnt + '</li>');
            }

これは、5 つのリスト番号を設定する現在のループです。現在のリストの値を取得したい場合は、次のようにしています。

function GetPageno() {
        //this.val();


        alert(document.getElementById('pageno').val());


    }

Web ページに 1 ～ 5 個の番号リストがあります。

クリックした数値の値を取得するにはどうすればよいですか?

元。「5」をクリックすると、すべてのリスト要素と同じように、値「5」でアラートが発生するはずです。

4

8 に答える 8

1

value 属性に小さな間違いがあります。cnt の直後に移動する二重引用符。次のように、li オブジェクトを関数、つまり GetPageno(this) に渡します。

 for (var cnt = 1; cnt <= 5; cnt++) {
     $("#newList").append('<li id="pageno" value="' + cnt + '" onclick="GetPageno(this);" > ' + cnt + '</li>');
 }

次に、メソッドに渡された li オブジェクトの値を取得します。

function GetPageno(obj) {
    alert(obj.value);
}
于 2013-04-03T05:12:54.147 に答える
1

val().attr("value")をli使用できます。data ( )属性 (data-someattributeName など) を使用して、より明確にすることをお勧めします。同じ ID を複数の要素に割り当てていますが、これは正しくありません。それらにクラスを割り当て、クラスでイベントをバインドすると、必要な属性を取得できます。

それらを作成するときにli要素にクラスを追加します。適切に割り当てcntられておらず、value空の文字列を値に割り当てています

for (var cnt = pageno; cnt < pageno + 5; cnt++) {
     $("#newList").append('<li id="pageno" class="pageno" value=""' + cnt + ' onclick="GetPageno();" > ' + cnt + '</li>');
}

クラス セレクターを使用してクリック イベントをバインドする

$(".pageno").click(function() {
    alert($(this).attr('value'));
})

data()とクラス セレクターを使用したライブ デモ。ここでは、 unique Idsにも を割り当てpagenoます。

pageno = 1;
for (var cnt = pageno; cnt < pageno + 5; cnt++) {
     $("#newList").append('<li id="pageno"'+cnt+' class="pageno" data-custom="' + cnt + '" onclick="GetPageno();" > ' + cnt + '</li>');
}

$(".pageno").click(function() {
    alert($(this).data('custom'));
});
于 2013-04-03T04:44:30.187 に答える
1

ID は一意である必要があります。次のようにできます。

for (var cnt = pageno; cnt < pageno + 5; cnt++) {
   $("#newList").append('<li class="pageno" value="'+cnt+'"> ' + cnt + '</li>');
}

と：

$("#newList").on("click", "li.pageno", function() {
  alert( $(this).val() );
});

jsFiddleデモ

于 2013-04-03T04:45:25.843 に答える
0

すべてにクラス名を使用する必要があります

  • IDの代わりに。ID は HTML ページ全体で一意である必要があります

    次のようにコードを変更できます

    for (var cnt = pageno; cnt < pageno + 5; cnt++) {
 $("#newList").append('<li class="pageno" value="'+cnt+'"> ' + cnt + '</li>');
}

    ドキュメント対応スコープに新しいjquery関数を追加します

    $(".pageno").click(function() {
alert($(this).attr('value'));

    }))

    • 于 2013-04-03T04:48:54.420 に答える
    0

    ID は一意である必要があります。代わりにクラスを使用する必要があります。次に、jQuery.each()を使用して、クラスを反復処理できます。

    $(".pageno").each(function() {
    alert($(this).attr('value'));
})
    于 2013-04-03T04:44:41.277 に答える
    0

    次の理由で問題が発生しています。

    • ids は一意である必要がありますclass。
    • また、インラインではなく、後でイベントを添付する必要があります（設定）。

    • 要素を as として参照し、not asthisを使用することは、 の有効な属性ではありません。.text().val()valueli

      for (var cnt = 1; cnt < 5; cnt++) {
    $("#newList").append('<li class="pageno" ' + cnt + '>' + cnt + '</li>');
}
$('.pageno').click(GetPageno);

function GetPageno() {
    alert($(this).text());
}
    于 2013-04-03T04:45:20.843 に答える
    0

    次のようにします。

    for (var cnt = pageno; cnt < pageno + 5; cnt++) {
                    $("#newList").append('<li id="pageno"+cnt value=""' + cnt + ' onclick="GetPageno(this.value);" > ' + cnt + '</li>');
                }
    function GetPageno(val) {


            alert(val);


        }
    于 2013-04-03T04:45:40.500 に答える