我一直在使用此代码拉取所选的单选按钮名称并将其显示在其他位置。它一直工作正常,但有一组单选按钮已被替换为选择的图像。这段代码对他们不起作用,我不确定需要改变什么?
<script>
$(document).ready(function(){
$('.element_1 input').on('change', function() {
var x = ($('input[name=tmcp_radio_1]:checked', '.element_1').val().split('_')[0]);
document.getElementById("option_2").innerHTML = x;
});
});
</script>
以下是使用的HTML代码
<ul data-rules="{"Black_0":["0"],"White_1":["0"],"Natural Wood (Light)_2":["0"],"Natural Wood (Dark)_3":["0"]}" data-rulestype="{"Black_0":[""],"White_1":[""],"Natural Wood (Light)_2":[""],"Natural Wood (Dark)_3":[""]}" class="tmcp-ul-wrap tmcp-elements tm-extra-product-options-radio tm-element-ul-radio element_1 use_images_containter">
<li class="tmcp-field-wrap tm-per-row">
<input class="tmcp-field tm-product-image tm-epo-field tmcp-radio use_images" name="tmcp_radio_1" data-price="" data-rules="["0"]" data-rulestype="[""]" data-image="http://82.10.114.15/wordpress/wp-content/uploads/2015/05/bournemouth-pier-black.jpg" data-imagep="" value="Black_0" id="tmcp_choice_1_0_7" tabindex="7" type="radio" checked="checked">
<label for="tmcp_choice_1_0_7"><img class="tmlazy radio_image tm-tooltip lazy-hidden" alt="" src="http://82.10.114.15/wordpress/wp-content/uploads/2015/05/bournemouth-pier-black.jpg" data-tm-tooltip-swatch="on"><span class="checkbox_image_label" style="display: none;">Black</span></label>
<span class="amount hidden">£0.00</span>
</li>
</ul>