Question

我有一个下拉列表，列出了可以工作的人。每个选项中都有一个值和一个data-id-proofing级别。我想获取所选人员的data-id-proofinglevel的值，但它返回null。

使用MooTools和JavaScript，这就是我所拥有的：

$(document.body).addEvent("change:relay(.connectedassignments)", function (e, el) {
    let rowid = el.get('data-row-id');
    let proofingLevel = document.getElementById('connected[' + rowid + ']').getAttribute('data-id-proofinglevel');
    console.log('Proofing Level: ' + proofingLevel);
});

HTML是：

<select id="connected[1]" name="assignment[1][connected][]" class="connectedassignments" data-row-id="1">
    <option value="">Please select...</option>
    <option value="627" data-id-proofinglevel="4">Abby</option>
    <option value="375" data-id-proofinglevel="2">Jennifer</option>
    <option value="308" data-id-proofinglevel="0">Aimee</option>
</select>

我应该得到数字，例如4、2和0。

我尝试获取childNodes并遍历它们，但是无法访问该特定属性值。任何帮助将不胜感激。

Answer 1

我认为您在这一行上犯了一个错误：

let proofingLevel = document.getElementById('connected[' + rowid + ']').getAttribute('data-id-proofinglevel');

尝试将事件回调中的JS代码更改为此：

var rowId = 1
var list = document.getElementById('connected[' + rowId + ']')
var proofingLevel = list.options[list.selectedIndex].getAttribute('data-id-proofinglevel')

console.log('Proofing level: ' + proofingLevel || 'Not selected')

<select id="connected[1]" name="assignment[1][connected][]" class="connectedassignments" data-row-id="1">
    <option value="">Please select...</option>
    <option value="627" data-id-proofinglevel="4">Abby</option>
    <option value="375" data-id-proofinglevel="2" selected>Jennifer</option>
    <option value="308" data-id-proofinglevel="0">Aimee</option>
</select>

应该可以：）

如何在选项中获取data-id-proofinglevel的值

1 个答案: