简单的添加/删除类不起作用，但它完全有道理

Question

我知道这可能是一个更好的方法，但我还在学习。
我有一个带有两个按钮的多步骤表格：保存以供以后使用＆save＆amp; amp;提交。

当用户点击保存以供日后使用时，我想在视图页面的输入栏中添加一个引导标签。
如果用户点击了Save＆amp;提交，我想添加一个不同的bootstrap标签，但由于某种原因，它不起作用。
我在另一个项目中使用了类似的代码但是使用了复选框，并且它工作正常：

<input type="submit" name="Submit" value="Save & Submit" class="sf-right btn btn-success btn-lg" id="saveandsubmitbutton">

<input type="submit" name="Submit" value="Save for later"  class=" btn btn-primary" id="saveforlaterbutton">



<script>
$("#saveforlaterbutton").click(function() {
$("#status").val("pending");
$("#statuslabel").addClass("label label-warning");
$("#statuslabel").removeClass("label label-primary");
});
</script>



<script>

$(document).ready(function(){
$('#saveandsubmitbutton').click(function(){
$("#status").val("submitted");
$("#statuslabel").addClass("label label-danger");
$("#statuslabel").removeClass("label label-primary");
});
});
</script>

这是观看页面：

echo "<td><div id='statuslabel' class='label label-primary'>".$res['status']."</div></td>";

Answer 1

您正在移除＆＃34;标签＆＃34;加入后立即上课。尝试替换

的两个实例

$("#statuslabel").removeClass("label label-primary");

带

$("#statuslabel").removeClass("label-primary");

Answer 2

我知道有更好的方法可以做到这一点，但这种方式对我来说很容易。我还在学习循环和一切，所以如果有人能用代码发布更好的解决方案我会很感激。

我做的是，创建了另一个输入字段，当我稍后保存或提交时，我将特定的标签类值保存到数据库中，然后在视图中调用它：

<input type="text" readonly value="" class="form-control" id="labelview" name="labelview"  />


<script>
$("#saveforlaterbutton").click(function() {
$("#status").val("pending");
$("#labelview").val("label-warning");
  });
</script>


echo "<td><span class='label ".$res['labelview']."'>".$res['status']."</span></td>";

Answer 3

使用类或数据属性来标识元素，而不是ID。您似乎拥有动态行，因此您必须动态地为每一行附加事件或在某个全局级别捕获事件。要分别为每一行附加事件，首先使用css选择器选择所有按钮（或要将事件附加到哪个元素），然后运行foreach循环并附加事件，您将需要跟踪其他元素你可以使用.closest（）的行。我希望它有所帮助。