0

我目前正在进行 Sharepoint 自定义，并且遇到了一个问题，如果选择了特定的元素 ID，我需要调用一个函数。问题是每次我们安装 Sharepoint 实例时元素 ID 都会发生变化，所以我的目标是通过元素 ID 的“值”来识别元素 ID。为了给我的问题一些背景，这是html（不能更改）：

<span class="ms-RadioText" title="Yes"><input id="378Ukj200" name="radio_button" value="ctl00" checked="checked" type="radio"><label for="378Ukj200">Yes</label></span>
<span class="ms-RadioText" title="No"><input id="378Ukj201" name="radio_button" value="ctl01" type="radio"><label for="378Ukj201">No</label></span>

这些是当前基于 getElementID 的语句（一旦我们将实例添加到生产框，这些语句将不起作用）：

document.getElementByID('378Ukj200').onclick = new Function('checkForRadioChange("Yes");');
document.getElementByID('378Ukj201').onclick = new Function('checkForRadioChange("No");');

例如，我什至希望使用 span 标签实现一些效果（当然，由于多种原因，这永远不会起作用）：

var rispan = document.getElementsByTagName('span');

for( var i = 0, j= rispan.length; i < j; i+=1 ) {
    var classes = span[i].getAttribute("title");
    if( classes ) {
       if( classes.indexOf("Yes") != -1) {
          onclick = new Function('checkForRadioChange("Yes");');
       }
       else if( classes.indexOf("No") != -1) {
          onclick = new Function('checkForRadioChange("No");');
       }
    }
}
4

4 回答 4

1

由于输入似乎是跨度的唯一输入子项，因此获得以下内容相当简单：

var input = rispan[i].getElementsByTagName('input')[0]
...
input.onclick = new Function ...

http://jsfiddle.net/ExplosionPIlls/Y74bn/

您应该使用function () {}语法来定义匿名函数。 new Function对你来说似乎不太好。此外，onlick是陈旧而邪恶的！addEventListener如果存在，您应该使用。否则，attachEvent。

于 2013-02-05T01:31:05.880 回答
1

我会将我的代码放在具有固定 ID 的 div 中，然后获取孩子。

var nodes = document.getElementByID('div_id').children;

有了这个，我将在循环中测试 tagName 并在需要的地方附加 onclick 事件。

于 2013-02-05T01:32:30.903 回答
1

要匹配的结构：

<span class="ms-RadioText" title="Yes">
    <input id="378Ukj200" name="radio_button" value="ctl00" checked="checked" type="radio">
    <label for="378Ukj200">Yes</label>
</span>

输入元素的 CSS 选择器：

span.ms-RadioText[title="Yes"] > input[name="radio_button"]

使用允许 CSS 选择器的库。赢。

于 2013-02-05T01:33:06.090 回答
1

不确定您需要什么级别的兼容性，但在现代浏览器中，它可以很简单：

var inputs = document.querySelectorAll('input[title^="ctl"]');

[].forEach.call(inputs, function(input) {
  var label = input.nextSibling;

  input.addEventListener('click', function() {
    if (label.textContent == 'Yes') {
      ...
    }
  });
});
于 2013-02-05T01:35:16.787 回答