0

我在谷歌上看了一遍,我想我只是不知道要搜索什么,因为我想做一些相对简单的事情。如果我无法在线找到答案,我会尝试仅在此处提问。

我正在寻找纯 JavaScript 的答案。我不想使用 jquery。非常感谢!

您知道当您在线填写表格以结帐时,您可以单击一个选项,上面写着“如果您的帐单信息与您的运输信息相同,请选中此框”,然后当您单击该框时,帐单信息会自动填充有运输信息。

我能够让所有输入类型的文本正常工作,但我似乎无法让 billing_state 的下拉选择框与已经为 shipping_state 选择的下拉选择框相同。

我正在使用所有州。以下只是为了简化示例。

我有一个带有 an 的复选框,onchange="setBillingAddress(this)"我正在使用 if 语句来检查该框是否被选中。所以这一切都很完美。

我可以让在 shipping_state 中设置的 billing_state 下拉值在 billing_state 下拉列表中突出显示(单击下拉列表后,您只能看到它的值设置为 shipping_state 下拉列表中的值) . 我希望它可以预先选择并显示状态,而无需单击“选择状态”。

我的问题是,我应该在setBillingAddress()函数内部放置什么来使 billing_state 被预选并显示给用户,这样他们就不必看到另一个显示“选择状态”的下拉框,即使该值已经设置。

我有两个下拉菜单。一个名为 shipping_state 的 id 为 shipping_state,另一个名为 billing_state 的 id 为 billing_state

4

2 回答 2

2

您只需将一个的值设置为select另一个。您可能想检查一些旧问题并接受答案。

http://jsfiddle.net/pZZQt/

function setBillingAddress(elem) {
    document.getElementById('billing_state').value = elem.value;
}​
于 2012-04-06T03:33:23.553 回答
1

在您的帐单地址上添加一个“更改”事件处理程序,并在处理程序中,设置送货地址的选定索引以匹配帐单地址的选定索引(假设您的选择列表中的所有内容都匹配,它应该匹配)。在这里查看它的实际效果:

http://jsfiddle.net/4AcjD/10/

这是HTML:

<div id="billing">
<p>Billing:</p>
<select name="billingState" id="billingState">
    <option>Alabama</option>             
    <option>Alaska</option>                 
    <option>Arizona</option>
    <!-- etc -->
</select>
</div>

<div id="shipping">
<p>Shipping:</p>
<select name="shippingState" id="shippingState">
    <option>Alabama</option>             
    <option>Alaska</option>                 
    <option>Arizona</option>
    <!-- etc -->
</select>
</div>

和 Javascript:

var billingState = document.getElementById( "billingState" );
var shippingState = document.getElementById( "shippingState" );
billingState.addEventListener( "change", 
    function() { 
        shippingState.selectedIndex = billingState.selectedIndex;
    } );
于 2012-04-06T03:41:29.137 回答