使用d3過濾輸入表格的類型

我想選擇html表單中的所有按鈕以添加一些onclick事件，但我仍然有'd'未定義的錯誤，有人可以解釋我在哪裏我錯了？使用d3過濾輸入表格的類型

這裏html代碼：

<Form id="menu_f"> 
<input type="file" id="import_f" value="data.json" class="__KR_VIEW"> 
<input type="button" id="import" value="Import Data" class="__KR_VIEW"> 
<input type="button" id="edit_kr" value="Edit KR" class="__KR_VIEW" > 
....(a lot of input) 
</form>

這裏的D3代碼：

d3.select("#menu_f").selectAll("input").filter(function(d){return d.attr("type") == "button"}).on("click",function(d){menuHandler(d.attr("id"))});

這裏是我的錯誤：

TypeError: d is undefined

謝謝！

來源

2015-12-10 occimort

的d表示你已經「附接」到該元件/節點數據，您使用的d3.filter（）方法。您可能想要使用dom元素上的本機Array.filter（） –

謝謝，它正在工作，我在考慮d代表選擇中的所有元素！ – occimort

https://jsfiddle.net/kmzjjtyj/

的d表示你已經「附接」到該元件/節點，因爲您使用的d3.filter（）方法的數據。

您可能想通過步入d3集合來使用dom元素上的本地Array.filter（）。

例如，

d3 
.select("#menu_f") 
.selectAll("input")[0] // Step into the d3 collection to reach the array of elements 
.filter(function(d) { 
    // Filter on the array of elements 
});

來源

2015-12-10 14:46:53

再次感謝您提供詳細的答案！問題解決了！ – occimort

雖然@ AdamBotley的答案是正確的，更d3十歲上下的方式來做到這一點是：

d3.select("#menu_f") 
    .selectAll("input") 
    .filter(function(d) { 
    return (this.type === "button"); 
    }) 
    ...

在d3功能，this最經常指的是選定的元素。

全碼：

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script data-require="[email protected]" data-semver="3.5.3" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.js"></script> 
 
</head> 
 

 
<body> 
 
    <form id="menu_f"> 
 
    <input type="file" id="import_f" value="data.json" class="__KR_VIEW" /> 
 
    <input type="button" id="import" value="Import Data" class="__KR_VIEW" /> 
 
    <input type="button" id="edit_kr" value="Edit KR" class="__KR_VIEW" /> 
 
    </form> 
 
    <script> 
 
    d3.select("#menu_f") 
 
    .selectAll("input") 
 
    .filter(function(d) { 
 
     return (this.type === "button"); 
 
    }).each(function(d){ 
 
     console.log(this); 
 
    }); 
 
    </script> 
 
</body> 
 

 
</html>

來源

2015-12-10 14:54:39 Mark

'返回this.type ==「按鈕」;'應該足夠你的過濾器 – nikoshr

@nikoshr，謝謝，很好的接收。我可能習慣於用'd3'方式做事:) – Mark

使用d3過濾輸入表格的類型

回答

相關問題