jQueryがインラインonclickオブジェクトを渡します

objectをインラインonclick eventに渡すにはどうすればよいですか？次のコードを試してみると、undefinedまたは[object object]のいずれかが得られます。jQueryがインラインonclickオブジェクトを渡します

また、クリックイベントをhにバインドして、インラインコードを回避する方法もあります。

this.get = function(o) { 
    console.log(o, o.foo); 
} 

this.somefunction = function(robj) { 
    for (var i = 0, i <= robj.length; i++) { 
    var fname = robj[i]['filename'] 
    h += '<div class="checkbox checkbox-success" onclick="get(\'' + robj + '\')">' + 
     '<input id="' + fname + '" type="checkbox" class="styled"> ' + 
     '<label for="' + fname + '"><a data-fancybox-next class="button-next" href="#">' + fname + '</a></label>' + 
     '</div>'; 
    } 
}

出典

2017-10-31 Snappy

document.ready –

の外get関数は、外文書の準備ができて、それを宣言することなく、他のソリューションがあります宣言？ – Snappy

はい,,,,,グローバルスコープを割り当てることができます。次にグローバルスコープのget関数を割り当てます –

私はあなたのコードを見ていくつかの問題、

あなたのループがi < robj.lengthをする必要がありますdoucment.readyの外の機能を維持しなければなりません構文エラー,を持っています;
hは定義されていませんが、現在は使用されていません。
get()に渡された配列はo.foo

サイドノートを使用してアクセスすることができません。あなたが現在行っている引用アクションの一部をクリーンアップを支援するES6 template literalsを見てみましょう、たとえばid="' + fname + '"ためid="${fname}"

のように見えることができます

ここでは、（DOM要素を作成して）divにリスナーを追加し、そのオブジェクトをパラメータとして追加する方法について、上記の修正を加えた完全な実例を示します。

this.get = function(o) { 
 
    console.log(o); 
 
    console.log(o.foo); 
 
} 
 

 
this.somefunction = function(robj) { 
 
    for (let i = 0; i < robj.length; i++) { 
 
    var fname = robj[i]['filename'] 
 
    var myDiv = document.createElement("div"); 
 
    myDiv.className = "checkbox checkbox-success"; 
 
    myDiv.onclick = function(){get(robj[i])}; 
 
    myDiv.innerHTML = 
 
     '<input id="' + fname + '" type="checkbox" class="styled"> ' + 
 
     '<label for="' + fname + '"><a data-fancybox-next class="button-next" href="#">' + fname + '</a></label>'; 
 
    document.getElementById("container").appendChild(myDiv); 
 
    } 
 
} 
 
var robj = [{filename: "myFilename", foo: "myFoo"}] 
 
somefunction(robj);

<div id="container"></div>

出典

2017-10-31 19:59:49

あなたのonclickメソッドはあまり役に立ちません。それは常に 'myFoo'を渡します。 'filename'はどうでしょうか？ – sonubreeze

はオブジェクト全体を 'filename'と' foo'プロパティを含む 'get（）'メソッドに渡します。 –

ここには動的に書き込まれたonclickの例があります。単に

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script> 
 

 
    function changePath(distinct_inputs) 
 
    { 
 
     console.log(distinct_inputs); 
 
    } 
 
    
 
     
 
$(document).ready(function(){ 
 

 
     
 
var distinct_inputs = 0; 
 
    $('.icon1').click(function(){ 
 
     distinct_inputs = distinct_inputs + 1 ; 
 
     $('#insert-file').append('<ul class="ul list-inline"><li style="width:90%"><input onchange="changePath('+distinct_inputs+')" type="file" class="base'+distinct_inputs+' form-control form-input form-style-base"><input type="text" class="fake'+distinct_inputs+' form-control form-input form-style-fake" readonly placeholder="choose your file"><span class="glyphicon glyphicon-open input-place"></span></li><li class="icon fa fa-minus"></li></ul>'); 
 
    }); 
 

 
}); 
 
</script> 
 
</head> 
 
<body> 
 
<div id="insert-file" ></div> 
 
<button type="button" class="icon1">CLick here</button> 
 

 
</body> 
 
</html>

出典

2017-10-31 19:03:26

jQueryがインラインonclickオブジェクトを渡します

答えて

関連する問題