1

我有以下html。

<ul>
<li>
    <label id="firstswitch-lbl" class="hasTip">My First Selector:</label>
    <select id="first_switch" class="switch">
        <option value="0">Enable</option>
        <option selected="selected" value="1">Disable</option>
    </select>
</li>
<li>
    <label id="first_title-lbl" class="hasTip">First Select:</label>
    <input id="first_title" class="text" type="text" size="3" value="50">
</li>
<li>
    <label id="secondswitch-lbl" class="hasTip">My Second Selector </label>
    <select id="second_switch" class="switch">
        <option value="0">Enable</option>
        <option selected="selected" value="1">Disable</option>
    </select>
</li>
<li>
    <label id="second_title-lbl" class="hasTip">Second Select:</label>
    <input id="second_title" class="text" type="text" size="3" value="100">
</li>
<li>
    <label id="thirdswitch-lbl" class="hasTip">My Third Selector </label>
    <select id="third_switch" class="switch">
        <option value="0">Enable</option>
        <option selected="selected" value="1">Disable</option>
    </select>
</li>
<li>
    <label id="third_title-lbl" class="hasTip">Third Select:</label>
    <input id="third_title" class="text" type="text" size="3" value="200">
</li>
<li>
    <label id="fourthswitch-lbl" class="hasTip">My Fourth Selector </label>
    <select id="fourth_switch" class="switch">
        <option value="0">Enable</option>
        <option selected="selected" value="1">Disable</option>
    </select>
</li>
<li>
    <label id="fourth_title-lbl" class="hasTip">Fourth Select:</label>
    <input id="fourth_title" class="text" type="text" size="3" value="200">
</li>

并遵循 mootools javascript 工作正常。

    document.id('first_switch').inject(document.id('first_switch').getParent().getNext(), 'bottom');
document.id('first_title').getParent().getPrevious().dispose();
document.id('second_switch').inject(document.id('second_switch').getParent().getNext(), 'bottom');
document.id('second_title').getParent().getPrevious().dispose();

但是，我试图减少重复相同代码的次数，因为我有大约 20 条或更多类似的行，所以我希望使用 .each 函数使其更短或更简化，但无法弄清楚。

我正在尝试在 Selector 旁边添加值框，以便它们位于同一行而不是使用两行。任何帮助高度赞赏。先感谢您。

以下是 Fiddle示例代码的链接

4

1 回答 1

0

你应该稍微调整一下，但是：

document.getElements("li input.text").each(function(input) {
    var parent = input.getParent("li");
    input.inject(parent.getPrevious().getFirst(), "after");
    parent.destroy();
});

这将循环你的整个页面，所以我建议document.id("ulel").getElements

http://jsfiddle.net/dimitar/GzVca/1/

于 2012-05-16T08:56:53.860 回答