3

我有这个东西

<table>
  <tr>
    <td>
      foo
    </td>
    <td>
      <a href="#" data-action:edit="1">[EDIT]</a>
      <a href="#" data-action:delete="1">[DEL]</a>
    </td>
  </tr>
  <tr>
    <td>
      bar
    </td>
    <td>
      <a href="#" data-action:edit="2">[EDIT]</a>
      <a href="#" data-action:delete="2">[DEL]</a>
    </td>
  </tr>
  <tr>
    <td>
      foobar
    </td>
    <td>
      <a href="#" data-action:edit="3">[EDIT]</a>
      <a href="#" data-action:delete="3">[DEL]</a>
    </td>
  </tr>
</table>

我能够通过这个选择器获得单个属性：

$('[data-action\\:edit]')或者$('[data-action\\:delete]')

我怎样才能获得所有data-action:*元素？

4

2 回答 2

2

这是使用 KnockoutJS 而不是 jQuery 来做这种事情的替代解决方案（将操作绑定到元素）。

我们不会将数据存储在 DOM 中，而是将其存储在 JavaScript 对象中。

我知道这并不完全是您想要的，但我认为它为潜在问题提供了更清洁的解决方案。

HTML：

<table>
    <tbody data-bind="foreach: elements">
        <tr>
            <td data-bind="text: name"></td>
            <td> 
                <a href="#" data-bind="click: $root.edit">[EDIT]</a>
                <a href="#" data-bind="click: $root.del">[DEL]</a>
            </td>
        </tr>
    </tbody>
</table>

JavaScript：

function tElement(name){
    this.name = name;
}

function ViewModel(arr){
    var self=this;
    this.elements = ko.observableArray(arr);
    this.del = function(elem){
        self.elements.remove(elem);
    }
    this.edit = function(elem){
        alert("edit called on element with name "+elem.name);    
    }
}

var vm = new ViewModel([new tElement("foo"),new tElement("bar"),new tElement("foobar")]);

ko.applyBindings(vm);

工作 JSFiddle

于 2013-05-18T12:19:34.613 回答
0

我知道这可能不是您想要的，但您会考虑添加类似

contains-data-action=true

对于您发送的每个带有“数据操作：”属性的锚点？并对此进行查询？

于 2013-05-18T12:16:32.737 回答