javascript - 使用 d3 通过类型过滤输入表单

标签 javascript html d3.js

我试图选择 html 表单中的所有按钮以添加一些 onclick 事件,但我仍然有“d”未定义错误,有人可以解释我错在哪里吗?

这里是 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

谢谢!

最佳答案

虽然@AdamBotley的答案是正确的,但更d3的方法是:

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

d3 函数中,this 通常始终引用所选元素。

<小时/>

完整代码:

<!DOCTYPE html>
<html>

<head>
  <script data-require="d3@3.5.3" 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>

关于javascript - 使用 d3 通过类型过滤输入表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34204442/

相关文章:

javascript - 值低于 150px 的 iframe 高度

javascript - 如何使用 javascript 禁用和重新启用按钮?

html - 向上滑动内容不正常

HTML 5 拖放

javascript - D3 折线图上的标签不起作用

javascript - D3.js csv 交互过滤器

javascript - 如何在 d3js 中排序后将条形图重新排序到其初始状态

javascript - 使用 XML 创建配置文件并在 HTML5 中读取 XML

javascript - MongoDb 聚合 $match 错误 : "Arguments must be aggregate pipeline operators"

javascript - jQuery SlideDown 不适用于具有动态分配 id 的元素