OpenCart 1.5.6.4处理checkout.tpl上的点击事件(带有输入select的新发货方法）

OpenCart 1.5.6.4 handle click event on checkout.tpl (new shipping-method with input select)

本文关键字：输入 select 方法 新发货 事件 4处理 checkout OpenCart tpl      更新时间：2023-09-26

我在OpenCart 1.5.6.4文件catalog/view/theme/default/template/checkout.tpl中进行了编辑，试图用select元素在我的新发货方法中处理点击事件。单击select element#bmat_data to be checked单选按钮后，我需要id为#bmat.bmp的按钮。

这部分代码通过ajax从catalog/view/theme/default/template/checkout/shipping_method.tpl 加载到checkout.tpl

<div id="shipping-method">
  <div class="checkout-heading">Step 4: Shipping</div>
  <div class="checkout-content">
    ...
    <tr class="highlight">
     <td><input type="radio" name="shipping_method" value="bmat.bmat" id="bmat.bmat"></td>
     <td>
       <label for="bmat.bmat">BMat</label>
       <select name="bmat_data" id="bmat_data">
         <option value="0">---</option>
         <option value="1">A</option>
         <option value="2">B</option>
       </select>
     </td>
     <td style="align:right;"><label for="bmat.bmat">some price</label></td>
    ...
  </div>
</div>

在文件checkout.tpl中，在行以<script type="text/javascript"><!--开头之后，我插入了这个jquery代码来处理它

$('#bmat_data').click( function() {
    $('#bmat''.bmat').prop('checked',true);
});

点击选择元素后，单选按钮没有被选中，我无法解决原因。如果我在单独的文件中编写simmilar代码，它就可以工作，但在OC中的checkout.tpl文件中则不行。有人能帮忙吗？

我尝试了另一种方法，将jquery代码直接插入select元素中，它就可以工作了。有人知道为什么它会以这种方式工作，而以前没有吗？

<select name="bmat_data" id="bmat_data" onclick="$('input#bmat''.bmat').prop('checked', true);">

我已经解决了这个问题。在加载checkout.tpl时，我想要处理的元素并不存在（只有基本结构）。这些元素稍后通过ajax注入。当我将jquery代码移动到注入的文件shipping_method.tpl时，它可以正常工作。

<div id="shipping-method">
  <div class="checkout-heading">Step 4: Shipping</div>
  <div class="checkout-content">
    ...
    <tr class="highlight">
     <td><input type="radio" name="shipping_method" value="bmat.bmat" id="bmat.bmat"></td>
     <td>
       <label for="bmat.bmat">BMat</label>
       <select name="bmat_data" id="bmat_data">
         <option value="0">---</option>
         <option value="1">A</option>
         <option value="2">B</option>
       </select>
     </td>
     <td style="align:right;"><label for="bmat.bmat">some price</label></td>
    ...
  </div>
</div>
<script>
  $('#bmat_data').click( function() {
      $('#bmat''.bmat').prop('checked',true);
  });
</script>
});
相关文章：