在原型中獲取選定複選框的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) 
}); 

文本