Question

在我的下面的代码中。共有8个文本框包含div，从fa1到fa8的ID。

fa1和fa2设置为默认显示
使用添加\删除按钮（addfa和removefa）添加和删除其他div，并使用hidden输入元素使用其{{1}跟踪计数}（默认值3）
添加按钮会在显示所有隐藏的div（即value = 9）时被禁用，并且一旦有3个或更多文本框（即countfa值4，则会启用删除按钮或更多）
fa3到fa8设置为countfa并使用上面提到的添加\删除ID来显示它们
我需要在表单提交后保留用户输入的数据文本框。

我面临的问题：我正在使用一个用于隐藏输入元素的PHP代码，在表单提交后根据用户的div id选择更新其display:none个depednds。我看到，尽管表单提交后有3个或更多文本框，但删除按钮仍处于禁用状态。我已检查隐藏的输入value是否正在使用新值进行更新，我看到它已更新，但仍然会删除按钮状态。任何想法为什么它没有显示在启用状态。

我的HTML代码：

value

和我的javascript代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
<form  id="main" name="main" action="#text" method="post" > 

<div id="fa1">
<input  class="textbox" id="tbox1" name="tbox1" type="text" value="<?php if(isset($_POST['tbox1'])) { echo htmlentities ($_POST['tbox1']); }?>" /></span>
</div>

<div id="fa2">
<input  class="textbox" id="tbox2" name="tbox2" type="text" value="<?php if(isset($_POST['tbox2'])) { echo htmlentities ($_POST['tbox2']); }?>" /></span>
</div>

<div id="fa3" style="<?php if(empty($_POST['tbox3'])) { echo "display:none;"; } else { echo "display:block;"; } ?>">
<input  class="textbox" id="tbox3" name="tbox3" type="text" value="<?php if(isset($_POST['tbox3'])) { echo htmlentities ($_POST['tbox3']); }?>" /></span>
</div>

<div id="fa4" style="<?php if(empty($_POST['tbox4'])) { echo "display:none;"; } else { echo "display:block;"; } ?>">
<input  class="textbox" id="tbox4" name="tbox4" type="text" value="<?php if(isset($_POST['tbox4'])) { echo htmlentities ($_POST['tbox4']); }?>" /></span>
</div>

<div id="fa5" style="<?php if(empty($_POST['tbox5'])) { echo "display:none;"; } else { echo "display:block;"; } ?>">
<input  class="textbox" id="tbox5" name="tbox5" type="text" value="<?php if(isset($_POST['tbox5'])) { echo htmlentities ($_POST['tbox5']); }?>" /></span>
</div>

<div id="fa6" style="<?php if(empty($_POST['tbox6'])) { echo "display:none;"; } else { echo "display:block;"; } ?>">
<input  class="textbox" id="tbox6" name="tbox6" type="text" value="<?php if(isset($_POST['tbox6'])) { echo htmlentities ($_POST['tbox6']); }?>" /></span>
</div>

<div id="fa7" style="<?php if(empty($_POST['tbox7'])) { echo "display:none;"; } else { echo "display:block;"; } ?>">
<input  class="textbox" id="tbox7" name="tbox7" type="text" value="<?php if(isset($_POST['tbox7'])) { echo htmlentities ($_POST['tbox7']); }?>" /></span>
</div>

<div id="fa8" style="<?php if(empty($_POST['tbox8'])) { echo "display:none;"; } else { echo "display:block;"; } ?>">
<input  class="textbox" id="tbox8" name="tbox8" type="text" value="<?php if(isset($_POST['tbox8'])) { echo htmlentities ($_POST['tbox8']); }?>" /></span>
</div>

<?php
 if(isset($_POST['countfa'])){  
 $valueid = $_POST['countfa'];
 ?>
<input  type="hidden" id="countfa" name="countfa" value="<?= $valueid ?>" readonly>
<?php
 }else{
  ?>

<input  type="hidden" id="countfa" name="countfa" value="3" readonly> 
 <?php
 }
?> 
<button type="button" onClick="AddNewFa();" id="addfa" > + Add New FA </button>
<button  type="button" onClick="RemoveNewFa();" id="removefa" disabled="disabled"> - Remove FA</button> 

<input  id="generate" type="submit"  name="script" value="create my symcli script" />

</form> 
</body>
</html>

我为此设置了PHP FIDDLE 注意：在PHP提示中，添加按钮在表单提交后不起作用。但我在实际网站上看到它工作正常。删除按钮仍然无法正常工作

Answer 1

我相信按钮显示的原因是因为您必须启用/禁用它们的代码放在每个项目的click处理程序中。

您应该移动以下代码：

if( facount >=9 )
{ $('#addfa').attr('disabled','disabled');} 
if( facount >=4 )
{ $('#removefa').removeAttr("disabled");}

进入单独的功能，即

function CheckButtons() {
    var facount = parseInt($('#countfa').val(),9) ;
    if( facount >=9 )
    { $('#addfa').attr('disabled','disabled');} 
    if( facount >=4 )
    { $('#removefa').removeAttr("disabled");}
    if( facount <=3 )
    { $('#removefa').attr('disabled','disabled');} 
    if( facount <=8 )
    { $('#addfa').removeAttr("disabled");} 
}

在表单提交运行后调用此函数。您还应该通过单击处理程序调用此函数（以最小化复制的代码）

$(document).ready(function() {
    CheckButtons();
});

Answer 2

您需要做的是进行文档就绪检查，以查看是否可以查看超过2个输入框。如果这样做，请删除已禁用的属性。问题是，当您提交表单时，您的html将被重置，并且删除按钮已设置为禁用。

表单提交后，html按钮保持处于禁用状态

2 个答案: