0

d3.jsのデータを使用して動的に生成された要素にクリックイベントをバインドしようとしています。

d3.select("#mylist").selectAll('li').data(data_arr).enter().append("li").html(
        function(d)
        {
            var element = document.createElement('div');
            element.innerHTML = '<div id="innerDiv"></div>';

            var divToClick = element.querySelector('#innerDiv');
            //Using jquery to get cross browser event binding
            $(divToClick).click(function(){
                alert('hello!');
            });



            return element.innerHTML;
       });

問題は文字列（innerHTML）を返すことですが、要素を返すと機能しません。何か助けはありますか？

（実際のコードははるかに複雑です。ここに重要な部分をコピーしました）。

4

2 に答える 2

5

これを行うよりd3の方法は次のようになります

d3.select("#mylist").selectAll('li').data(data_arr).enter()
  .append("li")
  .append("div")
  .on("click", function() { alert("hello!"); });
于 2012-05-22T19:05:17.357 に答える
0

これが答えです。

 var li_arr = d3.select("#mylist").selectAll('li').data(data_arr).enter().append("li").html(
    function(d)
    {
        var element = document.createElement('div');
        element.innerHTML = '<div id="innerDiv"></div>';
        return element.innerHTML;
   });

 li_arr.select('#innerDiv').each(function(d,i)
       {
            var mydiv = d3.select(this);
            mydiv.on('click',function(){
                alert('hello');
            });
       });
于 2012-05-22T21:01:06.903 に答える