Question

基本上，如果在特定DIV中更改了任何文本字段，我想从另一个DIV中清空HTML。

HTML：

<div class="row">

<div class="span4">

    <h3 class="heading" data-toggle="collapse" data-target="#shipper">Shipper Information</h3>

    <div class="bg-light collapse in bg-light" id="shipper">

        <label>Name</label>
        <input type="text" id="shipper_name" />

        <label>Address 1</label>
        <input type="text" id="shipper_address1" />

        <label>Address 2</label>
        <input type="text" id="shipper_address2" />

        <label>City</label>
        <input type="text" id="shipper_city" />

        <label>State</label>
        <input type="text" id="shipper_state" />

        <label>Zip</label>
        <input type="text" id="shipper_zip" /> 

    </div>

</div>

<div class="span4">

    <h3 class="heading" data-toggle="collapse" data-target="#consignee">Consignee Information</h3>

    <div class="bg-light collapse in bg-light" id="consignee">

        <label>Name</label>
        <input type="text" id="consignee_name" />

        <label>Address 1</label>
        <input type="text" id="consignee_address1" />

        <label>Address 2</label>
        <input type="text" id="consignee_address2" />

        <label>City</label>
        <input type="text" id="consignee_city" />

        <label>State</label>
        <input type="text" id="consignee_state" />

        <label>Zip</label>
        <input type="text" id="consignee_zip" />

    </div>

</div>

JQuery的：

$('#shipper').find('input:text').change(function(){
    alert('I changed.');
    carriersClear('Shipper Details Changed');
    return false;
});

$('#consignee').find('input:text').change(function(){
    alert('I changed.');
    carriersClear('Consignee Details Changed');
    return false;
});

#consignee版本工作正常，#shipper没有任何意义，因为它们基本相同。

我的控制台也没有出现任何错误。

编辑：我有另一个叫托运人的Div。（是的。我是个白痴。） 每个人的教训：Ctrl + F可以成为你最好的朋友。

Answer 1

我认为您的问题出在carriersClear()上。但这有效：

$('input[type="text"]', '#shipper').on('change', function(){
    console.log("I changed.");
    carriersClear('Shipper Details Changed');
    //No need to return false.
});

$('input[type="text"]', '#consignee').on('change', function(){
    console.log("I changed.");
    carriersClear('Consignee Details Changed');
});

这也有效：

//Here we assign only one event handler to #consignee.
$('#consignee').on('change', 'input[type="text"]', function(e){
    console.log("I changed.");
    carriersClear('Consignee Details Changed');
});

我建议您在事件处理程序上观看this video以便更好地理解。

这是Fiddle

jQuery $ .change在一个地方工作，但不是另一个地方

1 个答案: