0

list[i].fnctnこれは実際のコードですが、クリック ハンドラに正しく渡すにはどうすればよいですか?

list[i].fnctn- クリック イベント ハンドラーにアタッチする関数の名前が含まれています。

function createList(list){
    var parentID = $("#content_nav ul");
    var len = list.length;
    for(var i=0;i<len;i++){
        var anchorElement = jQuery('<a />',{text:list[i].text});
        var liElement = jQuery('<li />',{"class":"navlink_"+(i+1),id:"navlink_"+(i+1)});
        //anchorElement.attr('onclick',list[i].fnctn+"()"); - Works fine on desktop browsers but doesn't work on mobile devices. (Mobile devices are my target platform

        anchorElement.on('click',function(event) {
            return window[list[i].fnctn](event); // Here I am getting the error - cannot access property fnctn of undefined
        });
        liElement.append(anchorElement);
        parentID.append(liElement);
    }
}
4

5 に答える 5

3

それが役に立ちますか、この方法でこれが可能かどうかはわかりません.on()

var message = 'Some value that I want to access inside handler function';


$('#myHandler').click({msg: message},function(e){
    alert(e.data.msg);
});

編集:

xiaowlが述べたように。シナリオに合わせてコードを変更します。

function myFunction(){
    var message= "Some value that I want to access inside handler function";
    $("#myHandler").on('click', {msg: message}, function(e){
        alert("I want to alert the value - " + e.data.msg);
    });
}

実際の状態について

function createList(list){
    var parentID = $("#content_nav ul");
    var len = list.length;
    for(var i=0;i<len;i++){
        var anchorElement = jQuery('<a />',{text:list[i].text});
        var liElement = jQuery('<li />',{"class":"navlink_"+(i+1),id:"navlink_"+(i+1)});
        anchorElement.on('click',{myFunction: list[i]}, function(event) {
            return window[event.data.myFunction](event);
        });
        liElement.append(anchorElement);
        parentID.append(liElement);
    }
}
于 2012-08-01T08:39:25.297 に答える
1

http://api.jquery.com/on/

.on( イベント [, セレクタ] [, データ], ハンドラ(イベントオブジェクト) )

events "click" や "keydown.myPlugin" など、スペースで区切られた 1 つ以上のイベント タイプとオプションの名前空間。

selectorイベントをトリガーする選択された要素の子孫をフィルタリングするためのセレクター文字列。セレクターが null または省略されている場合、イベントは選択された要素に到達したときに常にトリガーされます。

dataevent.dataイベントがトリガーされたときにハンドラーに渡されるデータ。

handler(eventObject)イベントがトリガーされたときに実行する関数。値 false は、単純に false を返す関数の省略形としても使用できます。

したがって、ハンドラーで、を使用event.data['xyz']してデータを取得します。

于 2012-08-01T08:38:31.850 に答える
1

あなたの問題は、パラメータを渡すことではなく、スコープに関連しています。iループの後になり=== len、すべての関数が同じ を参照していますがi、これは配列内のインデックスでさえありません。

$.each透過的に無料のクロージャーを提供するので、試してみてください。

function createList(list) {

    var parentID = $("#content_nav ul");

    $.each(list, function(i, v) {
        var anchorElement = jQuery('<a />', {
            text: v.text
        });
        var liElement = jQuery('<li />', {
            "class": "navlink_" + (i + 1),
            id: "navlink_" + (i + 1)
        });
        anchorElement.on('click', function(event) {
            return window[v.fnctn](event); // Here I am getting the error - cannot access property fnctn of undefined
        });
        liElement.append(anchorElement);
        parentID.append(liElement);
    });
}
于 2012-08-01T08:51:27.240 に答える
0
function myHandler(event) {
    alert(event.data.foo);
}

$("p").on("click", {foo: "bar"}, myHandler)

以下に例を示します: http://api.jquery.com/on/

あなたのバージョンでは、私は思う:

function myFunction(){

    var xyz = "Some value that I want to access inside handler function";

    $("#myHandler").on('click', {msg: xyz}, function(event){

        alert("I want to alert the value - " + event.data.msg);
        //Error is logged in console as xyz is undefined.

    });
}

myFunction();

更新:正常に動作します。

Upd2: ここでは、問題の上記の例を示しています。http://jsfiddle.net/kjLmm/

Upd3: したがって、上記の例のように、リスト要素をパラメーターとして渡すことができます。

anchorElement.on('click', {element: list[i]}, function(event) {
            return window[event.data.element.fnctn](event); // Here I am getting the error - cannot access property fnctn of undefined
        });
于 2012-08-01T08:37:52.760 に答える
0

値を一致させる必要があります。これを試してください:

ここにjsFiddleがあります。

function myFunction(){

    var xyz = "Some value that I want to access inside handler function";

    $(document).on('click','#myHandler',function(event){

        var takeId = this.id;

        if ( takeId === xyz ) {
           alert("your id is equal to"+xyz);
           //Error is logged in console as xyz is undefined.
        }else{
           alert("your id is not equal to"+xyz);
        }

    });
}

$(function() {//dont forgot to call function
    myFunction();
});
于 2012-08-01T08:39:25.717 に答える