javascript - 如何使用相同的javascript函数选择和序列化不同形式的数据

Question

我是 php 和 javascript/jquery 新手..而且我是意大利人，所以请原谅我的英语。

我只想在按钮(onclick)中使用一个函数，以便在同一页面中以不同的形式使用它，然后我想使用序列化函数获取表单的数据。所以我不能使用选择器 $(form#myform) 因为不同的表单有不同的 id。

这是html

<form id="myform_1">        
    <select class="form-control" name="tipo">
        <option value="standard">standard</option>
    </select>
    <input type="number" name="giorni" value="90"/>
    <input type="number" name="attesa" value="1"/>  
    <button type="button" onclick="FormManipulator()">Crea</button>
</form>

这是我尝试过的功能

function FormManipulator(){
  var form_new = $(this).parents("form");
  var data = form_new.serialize();
  alert("data: " + data);
}

但是我无法获取输入的数据...警报为空。我的错误在哪里？有人可以解释并给出解决方案吗？

Answer 1

我不知道函数上的 $(this) 指的是什么..但我认为它不是指您想要的确切元素，因此您需要传递 FormManipulator(ThisForm ) 在你的函数中并像 FormManipulator(this)

一样使用它

你可以使用这样的东西

function FormManipulator(ThisForm){
  var form_new = $(ThisForm).closest("form");
  var data = form_new.serialize();
  alert("data: " + data);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form id="myform_1">        
    <select class="form-control" name="tipo">
        <option value="standard">standard</option>
    </select>
    <input type="number" name="giorni" value="90"/>
    <input type="number" name="attesa" value="1"/>  
    <button type="button" onclick="FormManipulator(this)">Crea</button>
</form>

<form id="myform_2">        
    <select class="form-control" name="tipo">
        <option value="standard">standard</option>
    </select>
    <input type="number" name="giorni" value="90"/>
    <input type="number" name="attesa" value="1"/>  
    <button type="button" onclick="FormManipulator(this)">Crea</button>
</form>