Question

我隐藏了DIVS，它显示的表单元素取决于单击的单选按钮。我看到很多这样做的方法，我实现了其中之一，它确实有效。问题是如果有人改变主意并点击一个单选按钮，然后单击另一个单选按钮。现在隐藏了与他们的第一个单击按钮相关联的DIV中填写的内容，但该值仍然存在并随表单一起提交。我需要一种方法来清空/删除他们最初填写的表单元素值，如果有人最终点击另一个单选按钮..

我尝试将此行添加到我的工作代码中，但它似乎没有做任何事情：

$("#dvCanDentalDate, #dvCanDentalDep, #dvDHMO").val('')

这是完整的脚本块。除了我在2个地方添加的上面的代码行，其余的工作正常。

$('input[name=dental]').click(function () {
    if (this.id == "dental1") {
        $("#dvChooseDental").show('slow');
        $("#dvDentalWaive, #dvCanDentalDate, #dvCanDentalDep, #dvDHMO").hide('slow');
    } else if (this.id == "dental2") {
        $("#dvDentalWaive").show('slow');
        $("#dvChooseDental, #dvCanDentalDate, #dvCanDentalDep, #dvDHMO").hide('slow');
        $("#dvCanDentalDate, #dvCanDentalDep, #dvDHMO").val('')
    } else if (this.id == "dental3") {
        $("#dvDentalWaive").show('slow');
        $("#dvChooseDental, #dvCanDentalDate, #dvCanDentalDep, #dvDHMO").hide('slow');
        $("#dvCanDentalDate, #dvCanDentalDep, #dvDHMO").val('')
    } else if (this.id == "dental4") {
        $("#dvCanDentalDate, #dvDentalWaive").show('slow');
        $("#dvChooseDental, #dvCanDentalDep, #dvDHMO").hide('slow');
    } else if (this.id == "dental5") {
        $("#dvCanDentalDate, #dvCanDentalDep, #dvDentalWaive").show('slow');
        $("#dvChooseDental, #dvDHMO").hide('slow');     
    } else {
        $("#dvChooseDental, #dvCanDentalDate, #dvCanDentalDep, #dvDentalWaive, #dvDHMO").hide('slow');
    }
})

Answer 1

使用.html('')清空div

$("#dvCanDentalDate, #dvCanDentalDep, #dvDHMO").html('')

或

$("#dvCanDentalDate, #dvCanDentalDep, #dvDHMO").empty()

Answer 2

除了@Krishna的精细解决方案之外，另一个选择是禁用元素;禁用表单元素不随表单一起提交。所以，像：

$("#dvChooseDental").show('slow').find(':input').prop('disabled', false);
$("#dvDentalWaive, #dvCanDentalDate, #dvCanDentalDep, #dvDHMO").hide('slow').find(':input').prop('disabled', true);

这样做的另一个好处就是不必在以前清空HTML后重新创建HTML。

删除隐藏DIV的值

2 个答案: