Javascript 如何自动预选(而不仅仅是设置值)账单状态下拉列表与发货状态下拉列表相同

Javascript 如何自动预选(而不仅仅是设置值)账单状态下拉列表与发货状态下拉列表相同,javascript,javascript-events,Javascript,Javascript Events,我在谷歌上到处搜索,我想我只是不知道该搜索什么,因为我想做一些相对简单的事情。如果我在网上找不到答案,我会尝试在这里提问 我正在用纯javascript寻找答案。我不想使用jquery。非常感谢你 您知道当您在线填写表单结帐时,您可以单击一个选项“如果您的账单信息与您的配送信息相同,请选中此框”,然后当您单击该框时,账单信息会自动填充配送信息 我能够使所有输入类型的文本正常工作,但我似乎无法使账单状态的下拉选择框与已为装运状态选择的下拉选择框相同 我正在使用所有的状态。下面只是为了简化示例 我有

我在谷歌上到处搜索,我想我只是不知道该搜索什么,因为我想做一些相对简单的事情。如果我在网上找不到答案,我会尝试在这里提问

我正在用纯javascript寻找答案。我不想使用jquery。非常感谢你

您知道当您在线填写表单结帐时,您可以单击一个选项“如果您的账单信息与您的配送信息相同,请选中此框”,然后当您单击该框时,账单信息会自动填充配送信息

我能够使所有输入类型的文本正常工作,但我似乎无法使账单状态的下拉选择框与已为装运状态选择的下拉选择框相同

我正在使用所有的状态。下面只是为了简化示例

我有一个带有
onchange=“setBillingAddress(this)”
的复选框,我正在使用if语句检查复选框是否被选中。因此,所有这些都非常有效

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

我的问题是,我应该在
setBillingAddress()
函数中添加什么内容,以便预先选择并向用户显示账单状态,这样即使已经设置了值,用户也不必看到另一个显示“选择状态”的下拉框


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

您只需将一个
选择的值设置为另一个值。你可能想重温一些老问题并接受答案


只需将一个
选择的值设置为另一个值。你可能想重温一些老问题并接受答案

在帐单地址上添加一个“更改”事件处理程序,并在该处理程序中,将发货地址的选定索引设置为与帐单地址的选定索引匹配(假设您的选择列表中的所有内容都匹配,它应该匹配)。请在此处查看它的实际操作:

以下是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>
在帐单地址上添加一个“更改”事件处理程序,并在该处理程序中,将发货地址的选定索引设置为与帐单地址的选定索引匹配(假设您的选择列表中的所有内容都匹配,它应该匹配)。请在此处查看它的实际操作:

以下是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>

我可能没有抓住重点,只是在重读你的问题。这真的很长,而且有点难以理解。您是否在询问如何在不使用
onchange
事件的情况下使值相同?所以,当你勾选复选框时,它会将一个设置为另一个?嘿,非常感谢!我复制并粘贴了你的例子,效果非常好。然而,在我的示例中,我希望单击一个复选框,该复选框显示“与发货相同”,然后单击该复选框后,它会将账单状态设置为与发货状态相等。此外,两个选择下拉菜单都需要有两个不同的名称,以防账单状态与发货状态不同。因此,这将无法完全按照我所需要的方式工作。谢谢你让我知道接受答案。直到今天我才知道怎么做。我意识到你必须点击复选框lol。基本上答案是一样的。只需在复选框中添加一个更改处理程序即可完成相同的操作。非常感谢!成功了。但是现在我遇到了一个与css类冲突的问题,这个css类没有自动显示账单状态,因为它使用的css类是冲突的。我发现了这一点,因为如果我删除css类,它将非常有效!!!!!但我不希望js中的任何人也能解决这个问题,哈哈,有可能接受不止一个关于堆栈溢出的答案吗???很高兴这对你有用。不,您不能接受多个答案。如果您对SO的工作原理有疑问,那么您应该在上搜索它们。你可以阅读更多关于为什么这里不能接受多个答案的内容——我可能错过了这里的标记,只是重新阅读了你的问题。这真的很长,而且有点难以理解。您是否在询问如何在不使用
onchange
事件的情况下使值相同?所以,当你勾选复选框时,它会将一个设置为另一个?嘿,非常感谢!我复制并粘贴了你的例子,效果非常好。然而,在我的示例中,我希望单击一个复选框,该复选框显示“与发货相同”,然后单击该复选框后,它会将账单状态设置为与发货状态相等。此外,两个选择下拉菜单都需要有两个不同的名称,以防账单状态与发货状态不同。因此,这将无法完全按照我所需要的方式工作。谢谢你让我知道接受答案。直到今天我才知道怎么做。我意识到你必须点击复选框lol。基本上答案是一样的。只需在复选框中添加一个更改处理程序即可完成相同的操作。非常感谢!成功了。但是现在我遇到了一个与css类冲突的问题,这个css类没有自动显示账单状态,因为它使用的css类是冲突的。我发现了这一点,因为如果我删除css类,它将非常有效!!!!!但我不希望js中的任何人也能解决这个问题,哈哈,有可能接受不止一个关于堆栈溢出的答案吗???很高兴这对你有用。不,您不能接受多个答案。如果你对h有疑问
var billingState = document.getElementById( "billingState" );
var shippingState = document.getElementById( "shippingState" );
billingState.addEventListener( "change", 
    function() { 
        shippingState.selectedIndex = billingState.selectedIndex;
    } );