【问题标题】:Uncheck checkbox if another is selected如果选择了另一个复选框,请取消选中复选框
【发布时间】:2018-01-16 17:19:55
【问题描述】:

所以我的页面上有以下 2 个复选框,附在小脚本上,旨在隐藏计费部分。

<script>

function myFunction2() {
    var x = document.getElementById("billing_info");
    if (x.style.display === "none") {
        x.style.display = "block";
    } else {
        x.style.display = "none";
    }
}

</script>

我正在使用以下脚本尝试取消选中复选框

    <script>
          $(document).ready( function a()
{
   if (  $('#sameAsBilling').is(':checked'))
    {
       $('#check2').attr('checked', false);
    }
});
</script>




        <div class="header">
           <h3 class="checkout-headers">STEP 3 - Billing Information </h3>
          <!--START: sameAsBilling1-->
<!--value="ON"-->
          <div class="sameAsBilling1">
            <input type="checkbox" name="sameAsBilling" id="sameAsBilling" onclick="showHideShipping();check_address('');"/>
            <label for="sameAsBilling">Same as Delivery Address</label>
            <div class="clear"></div>
          </div>
            <div class="differentBilling">
                <input type="checkbox" class="example" id="check2" onclick="myFunction2()"; return false;>Different Billing Address?</div>
          <!--END: sameAsBilling1-->
          <div class="clear"></div>
        </div>

我的问题是有人将以下代码埋在 javascript 文件中,如果选中特定复选框,该文件会将交付详细信息传输到计费详细信息中。

  function showHideShipping() {

     if (document.billing.sameAsBilling.checked) {
      add_overlay("billing_info", 0);

       if (get_Element('billing_firstname').value != get_Element('shipping_firstname').value) {
        get_Element('billing_firstname').value = get_Element('shipping_firstname').value;
        get_Element('billing_lastname').value = get_Element('shipping_lastname').value;
        get_Element('billing_company').value = get_Element('shipping_company').value;
        get_Element('billing_phone').value = get_Element('shipping_phone').value;
        get_Element('billing_address').value = get_Element('shipping_address').value;
        get_Element('billing_address2').value = get_Element('shipping_address2').value;
        get_Element('billing_city').value = get_Element('shipping_city').value;
        get_Element('billing_zip').value = get_Element('shipping_zip').value;
        get_Element('billing_country').value = get_Element('shipping_country').value;
        populateState('billing_state', 'billing_country');
        get_Element('billing_state').value = get_Element('shipping_state').value;
      }
    } else {
      remove_overlay("billing_info");

    get_Element('billing_firstname').value = '';
      get_Element('billing_lastname').value = '';
      get_Element('billing_company').value = '';
      get_Element('billing_phone').value = '';
      get_Element('billing_address').value = '';
      get_Element('billing_address2').value = '';
      get_Element('billing_city').value = '';
      get_Element('billing_zip').value = '';
      get_Element('billing_country').value = get_Element('shipping_country').value;
      populateState('billing_state', 'billing_country');
      get_Element('billing_state').value = get_Element('shipping_state').value;


    }
}

【问题讨论】:

  • 您能否解释一下“我的问题是有人将以下代码隐藏在一个 javascript 文件中,如果选中特定复选框,该文件会将交付详细信息传输到帐单详细信息中。”多一点?我不确定你的意思
  • 你不能检查 if (x is checked && y is checked) 吗?
  • remove_overlay('billing_info')之前的行是否缺少else
  • 基本上,我刚开始在一家公司工作,我作为新实习生已经在那里呆了 2 天。我正在尝试修复他们的结帐页面。在他们的后端是他们的 js 文件,其中有一个结帐验证 js 文件,作为我发布的代码(以及其他东西)。
  • 我尝试在您建议的地方添加一个 else ,但它只是使页面无法正常运行。

标签: javascript jquery html checkbox


【解决方案1】:

您缺少else。因此,无论复选框的状态如何,隐藏帐单信息并将运输信息复制到其中的代码都会一直执行。

   if (document.billing.sameAsBilling.checked) {
      add_overlay("billing_info", 0);

      get_Element('billing_firstname').value = '';
      get_Element('billing_lastname').value = '';
      get_Element('billing_company').value = '';
      get_Element('billing_phone').value = '';
      get_Element('billing_address').value = '';
      get_Element('billing_address2').value = '';
      get_Element('billing_city').value = '';
      get_Element('billing_zip').value = '';
      get_Element('billing_country').value = get_Element('shipping_country').value;
      populateState('billing_state', 'billing_country');
      get_Element('billing_state').value = get_Element('shipping_state').value;
    } else {
      remove_overlay("billing_info");
      if (get_Element('billing_firstname').value != get_Element('shipping_firstname').value) {
        get_Element('billing_firstname').value = get_Element('shipping_firstname').value;
        get_Element('billing_lastname').value = get_Element('shipping_lastname').value;
        get_Element('billing_company').value = get_Element('shipping_company').value;
        get_Element('billing_phone').value = get_Element('shipping_phone').value;
        get_Element('billing_address').value = get_Element('shipping_address').value;
        get_Element('billing_address2').value = get_Element('shipping_address2').value;
        get_Element('billing_city').value = get_Element('shipping_city').value;
        get_Element('billing_zip').value = get_Element('shipping_zip').value;
        get_Element('billing_country').value = get_Element('shipping_country').value;
        populateState('billing_state', 'billing_country');
        get_Element('billing_state').value = get_Element('shipping_state').value;
      }
    }

【讨论】:

  • 所以这似乎运行良好,唯一的问题是它仅在“与交付相同”复选框未选中时才有效
  • 交换了周围的元素(更新的 OP),因为我不知道为什么它们是这样的。在我的脑海里,检查与交付按钮相同的一切。 span>
  • 为什么需要两个复选框?无论如何,您添加的代码仅在页面首次加载时取消选中“不同的帐单地址”,而不是在用户单击某些内容时。
  • 我该如何改变这个?
  • 去掉第二个复选框,不需要。
猜你喜欢
  • 1970-01-01
  • 2019-01-03
  • 1970-01-01
  • 1970-01-01
  • 2015-05-08
  • 1970-01-01
  • 2021-11-23
  • 2018-04-15
  • 2021-12-23
相关资源
最近更新 更多