如何禁用需要多个输入，使在javascript

Question

其他输入如何输入禁用require与name = "item_name"，name="description"和name="quantity"当我通过使用JavaScript的目的textarea单击目的并启用require。

编辑：我真正的意思是，当我通过单击添加，只有input与名称item_namedescriptionquantity是必需的，当我点击目的提交表单时，textarea会是谁需要

一个提交表单

这里是我的代码：

<form action="../function/add_item.php" method="post"> 

<input id="autocomplete" name="item_name" placeholder="Item Name" required> 
<input type="text" name="description" placeholder="Description placeholder="Quantity"" required> 
<input type="number" name="quantity" required> 

<button name="submit" type="submit" class="btn btn-default">ADD</button> 

<textarea placeholder="Purpose (e.g. Office Use)" name="purpose" required></textarea> 

<button name="purpose" type="submit" class="btn btn-info">Purpose</button> 
</form> 

Answer 1

我想这是你可能会寻找代码：

$(function() { 
    $('[type=submit]').on('click', function() { 
     if($(this).attr('name') == 'submit') { 
      $('[name=item_name], [name=description], [name=quantity]').attr('required', 'required'); 
      $('[name=purpose]').removeAttr('required'); 
     } else if($(this).attr('name') == 'purpose') { 
      $('[name=purpose]').attr('required', 'required'); 
      $('[name=item_name], [name=description], [name=quantity]').removeAttr('required'); 
     } 
    }); 
}); 

Answer 2

添加id到您的按钮

<button id="purpose" type="submit" class="btn btn-info">Purpose</button> 

然后

$(function() { 
    $('#purpose').click(function() { 
     $('#item_name').removeAttr('required');​​​​​ 
     $('#description').removeAttr('required');​​​​​ 
     $('#quantity').removeAttr('required');​​​​​ 
     $('textarea').attr('required','1'); 
    }); 
}); 

Answer 3

试试这一个。我只是增加了一些JavaScript，并添加id's

document.getElementById('purpose').onclick = function() { 
 

 
    document.getElementById("name").required=false; 
 
    document.getElementById("des").required=false; 
 
    document.getElementById("qnt").required=false; 
 
}

<form action="../function/add_item.php" method="post"> 
 
<input id="name" name="item_name" placeholder="Item Name" required> 
 
<input id="des" type="text" name="description" placeholder="Description placeholder="Quantity"" required> 
 
<input id="qnt" type="number" name="quantity" required> 
 

 
<button name="submit" type="submit" class="btn btn-default">ADD</button> 
 
<textarea placeholder="Purpose (e.g. Office Use)" name="purpose" required></textarea> 
 

 
<button id="purpose" name="purpose" type="submit" class="btn btn-info">Purpose</button> 
 
</form>