Question

我碰巧禁用了一个div，里面有一些表单字段。我有其他领域的div。当我提交表单时，禁用div中的字段将被清空发送到数据库。如何禁用禁用div中的所有字段，因为它们被禁用。我的目的是将禁用div中的字段保存到表中，如果禁用为假。 div中的字段将保存在另一个表中。

我曾尝试将 readonly ，但这无法阻止他们提交。

<form>
  <div id="disable_texarea">
    <textarea class="form-control" id="textarea1"  disabled ></textarea>
    <textarea class="form-control" id="textarea2"   disabled></textarea>
    <!--there are many  inside  the disabled div-->
  </div>

  <input type="text" id="input1">
  <input type="text" id="input2">
  <input type="text" id="input3">
</form>

JS

$(document).ready(function() {
  $("#disable_texarea *").prop('disabled', true);
});

Answer 1

如果我理解你的问题，你可以这样做，在表格中插入一个id，就像这样

<form id="myForm">
<div id="disable_texarea">
   <textarea class="form-control" id="textarea1"  disabled > </textarea>
  <textarea class="form-control" id="textarea2"   disabled> </textarea>
   <!--there are many  inside  the disabled div-->
</div>

   <input type="text" id="input1">
  <input type="text" id="input2">
  <input type="text" id="input3">
</form>

您将有提交按钮后可以

  array=[];
  $('#submitButton').submit(function(event){
     $('#myForm textarea').each(function(k,w){
        disabledText = $(w).is(':disabled'));
        if (disabledText == true){
           idOfTheDisabledTextarea = w.id;
           array.push(idOfTheDisabledTextarea);//<--insert id disabled in an array
           console.log(idOfTheDisabledTextarea); //<--These are the id of the disabled textarea 
        }

     });
  });
  console.log(array);

如果你想让名字进入服务器端，请在html上插入名称，如果你要写，

     nameOfTheDisabledTextarea = w.name;

使用这些名称后，您可以在数据库上插入时执行所需操作。你有你的数组名为disabled我想，从服务器你可以做的，如果名称在数组禁用然后保存在表A否则在表B ...这样...我认为使用数组是最好的解决方案，但你可以做你想要的textare或输入的名称，但你需要一个区别因素，我认为阵列是最好的，如果名称在数组后被禁用..我肯定我更喜欢使用Ajax在这个断路器中调用而不是一个提交按钮，因为使用ajax你可以操作DOM并在将数组附加到ajax数据之后，恕我直言最好做一个ajax调用而不是一个提交按钮，但你也可以在提交事件中做jquery但是你必须将数组附加到提交的数据。如果我理解这个问题......再见....

Answer 2

为字段命名 - 如果没有名称，则不发送任何内容

看到这个，只找到一个字段 - 也找不到名为textarea的残疾人

$(function() {
  $("#disable_texarea *").prop('disabled', true);
  $("#but").on("click", function() {
    console.log($(this).closest("form").serialize())
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div id="disable_texarea">
    <textarea class="form-control" name="textarea1" id="textarea1" disabled></textarea>
    <textarea class="form-control" id="textarea2" disabled></textarea>
    <!--there are many  inside  the disabled div-->
  </div>

  <input type="text" name="input1" id="input1">
  <input type="text" id="input2">
  <input type="text" id="input3">
  <input type="button" id="but" value="click" />
</form>

Answer 3

尝试使用jQuery访问div的所有子节点，就像这样。

$("#disable_textarea").children().prop("disabled", true);

或者

$("#disable_textarea").children().attr("disabled", true);

使用jQuery禁用div内的所有字段

3 个答案: