从一个页面中多次出现的表单中检索元素值

Question

使用服务器端代码我使用相同的类创建多个表单以防止使用jquery提交，这个表单有一个选择框，根据它们的值我做了一些东西。

<form class="fooForm">
  <select name="fooBox">
    <option value="bar">bar</option>
  </select>
  <button type="submit">Send!</button>
</form>

<form class="fooForm">
  <select name="fooBox">
    <option value="bar11">bar11</option>
  </select>
  <button type="submit">Send!</button>
</form>

<form class="fooForm">
  <select name="fooBox">
    <option value="bar22">bar22</option>
  </select>
  <button type="submit">Send!</button>
</form>

<script>
    $(".fooForm").submit(function (e) {
        e.preventDefault();
        //How do I read the value of he current selectbox ???
    });
</script>

这一点我想知道，这是有效的HTML吗？如何从试图发布的表单中读取seletbox的值？

Answer 1

提交的表单存储在this中，可以通过将元素包装在jQuery容器中并应用.find()来找到选择框。使用.val()检索select的值。

$( this ).find( 'select' ).val();

关于HTML的有效性，请通过validator运行。 （它是。）

Answer 2

<子>
jQuery

$(".fooForm").submit(function (e) {
    e.preventDefault();
    console.log($(this).children('select').val());
    alert($(this).children('select').val());
});

希望这有助于...... !!!