在原型中获取选定复选框的innerHTML文本

Question

我需要从窗体中的选定复选框中获取文本。家政学联合会的形式是：

<form action="save" method="post" name="reunform" id="reunform" > 
<div id="listad"> 
    <ul id="litemsd"> 
    <li class="litemd"><input type="checkbox" name="d1" />Number One</li> 
    <li class="litemd"><input type="checkbox" name="d2" />Numer Two</li> 
    <li class="litemd"><input type="checkbox" name="d3" />Numer Three</li> 
    </ul> 
</div> 
... 
</form> 

使用原型：我怎样才能得到字符串“天下第一\ nNumberThree”应该将这些被选中？

要测试的东西我想：

$$('li.litemd').pluck('checked').each(function(s) { 
    alert(s.innerHtml) 
    }); 

但我得到的萤火 “S未定义”。

感谢

Answer 1

首先，哟你应该在复选框文本上使用<label>标签。这是一个可访问性问题。使用标签具有能够单击标签文本以检查框，这恐怕是很多用户（包括我自己）已经习惯于额外的好处......

<ul id="litemsd"> 
    <li class="litemd"> 
    <input type="checkbox" id="d1" name="d1" /> 
    <label for="d1">Number One</label> 
    </li> 
    <li class="litemd"> 
    <input type="checkbox" id="d2" name="d2" /> 
    <label for="d2">Numer Two</label> 
    </li> 
    <li class="litemd"> 
    <input type="checkbox" id="d3" name="d3" /> 
    <label for="d3">Numer Three</label> 
    </li> 
</ul> 

作为一个额外的好处，这使得你的代码更容易...

$$('li.litemd input:checked').each(function(s) { 
    alert(s.next().innerHTML) 
}); 

Answer 2

您寻找的是在li's的innerHTML，不input's。

下面有两件事你可以做：

1，但不是很漂亮：

$$('li.litemd').pluck('checked').each(function(s) { 
    alert(s.up().innerHtml.split('/>')[1]) 
}); 

2，敷在额外的div

<li class="litemd"><input type="checkbox" name="d1" /><div>Number One</div></li> 
<li class="litemd"><input type="checkbox" name="d2" /><div>Numer Two</div></li> 
<li class="litemd"><input type="checkbox" name="d3" /><div>Numer Three<div></li> 

然后

$$('li.litemd').pluck('checked').each(function(s) { 
    alert(s.next().innerHTML) 
}); 

文本