Question

我想同时使用两个具有相同类名的表单来实现按钮和＆amp;基于设计的输入。

如果我单击1按钮，它会触发表单并发送“空”值。

是否可以通过jquery方法在按钮点击上定位“最近”输入。

请告诉我解决此问题的意见或建议？

由于

HTML：

<form>
<div class="loginMHNo">
  <input class="login-MH--no" type="text" name="MHNumber" />
</div>
<div class="loginPassword">
  <input class="login-MH--password" name="Password" type="password"  />
</div>
  <button class="loginSubmit btn" type="submit">Login</button>
 </form>


<form>
<div class="loginMHNo">
  <input class="login-MH--no" type="text" name="MHNumber" />
</div>
<div class="loginPassword">
  <input class="login-MH--password" name="Password" type="password"  />
</div>
  <button class="loginSubmit btn" type="submit">Login</button>
</form>

Answer 1

当您点击提交按钮并使用$(this).closest('form')获取以该格式填写的序列化值时，您需要使用closest()获取$(this).closest('form').serialize()表单：

＆＃13;

$(".loginSubmit").on('click', function(e) {
  e.preventDefault();
  var closestForm = $(this).closest('form');
  console.log($(this).closest('form').serialize())
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div class="loginMHNo">
    <input class="login-MH--no" type="text" name="MHNumber" />
  </div>
  <div class="loginPassword">
    <input class="login-MH--password" name="Password" type="password" />
  </div>
  <button class="loginSubmit btn" type="submit">Login</button>
</form>


<form>
  <div class="loginMHNo">
    <input class="login-MH--no" type="text" name="MHNumber" />
  </div>
  <div class="loginPassword">
    <input class="login-MH--password" name="Password" type="password" />
  </div>
  <button class="loginSubmit btn" type="submit">Login</button>
</form>

＆＃13;

Answer 2

如果您更改按钮，则：

loginSubmit类型提交到按钮和onclick事件(onclick="login_clicked(this)")功能是;

function login_clicked(_this){
   var params = $(_this).closest("form").serialize();
   ajax...
}

Answer 3

使用这样的代码：

$('.loginSubmit').click(function(){
  $(this).parents('form').serialize();
});

如果您想提交表格

$('.loginSubmit').click(function(){
  $(this).parents('form').submit();
});
//to submit the particular forms

以下是serialize()功能和parents()功能的文档。

Jquery - 按钮onclick目标最近输入并获取值

3 个答案: