Получение текста innerHTML из выбранных флажков в Prototype - PullRequest
1 голос
/ 29 сентября 2010

Мне нужно получить текст из выбранных флажков в форме.Если форма:

<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>

Использование прототипа: как получить строку «Number One \ nNumberThree», если они выбраны?

Чтобы проверить что-то, я попробовал:

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

Но я получаю "s не определено" в firebug.

Спасибо

Ответы [ 2 ]

1 голос
/ 29 сентября 2010

Прежде всего, вы должны использовать <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)
});
0 голосов
/ 29 сентября 2010

Вы ищете внутренний HTML, а не входные данные.

Вот две вещи, которые вы могли бы сделать:

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)
});
...