我们的网站上有一个表单（例如T-Shirt），根据您选择的单选按钮进行更改。我编写了一个JS函数，它将移动下拉列表和桌面单选按钮配对。虽然视觉上一切正常，但添加到购物车功能仅适用于桌面而非移动设备。
当我通过diffchecker运行表单时，我注意到唯一更改的行是显示的价格和value的{{1}}。
目前，下拉列表会将<input type="hidden" name="variation_id" class="variation_id"> attr checked添加到相应的单选按钮，该按钮可用于显示目的，但我知道该表单实际上并不关心是否单选按钮为checked。
我不确定该表单正在寻找什么。我已尝试将click()传递到广播input及其label。我甚至尝试手动将.variation_id从652更改为653。但没有改变。表格没有处理。
JS在标记中看不到的单选按钮中是否存在属性？
这是一个选择了一个选项的表单：
<div class="av-woo-purchase-button avia-builder-el-16 el_after_av_hr avia-builder-el-last "><p class="price"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>25.00</span></p>
<form class="variations_form cart" method="post" enctype="multipart/form-data" data-product_id="651" data-product_variations="[{"attributes":{"attribute_size":"Extra Large"},"availability_html":"<p class=\"stock in-stock\">In stock<\/p>\n","backorders_allowed":false,"dimensions":"N\/A","dimensions_html":"N\/A","display_price":25,"display_regular_price":25,"image":{"title":"Madcap-VNeckTee-Grid-Retina","caption":"","url":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","alt":"Madcap-VNeckTee-Grid-Retina","src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png","srcset":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png 450w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-300x288.png 300w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-768x736.png 768w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-505x484.png 505w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png 960w","sizes":"(max-width: 450px) 100vw, 450px","full_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","full_src_w":960,"full_src_h":920,"thumb_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-120x120.png","thumb_src_w":120,"thumb_src_h":120,"src_w":450,"src_h":431},"image_id":"5823","is_downloadable":false,"is_in_stock":true,"is_purchasable":true,"is_sold_individually":"no","is_virtual":false,"max_qty":"","min_qty":1,"price_html":"","sku":"","variation_description":"","variation_id":652,"variation_is_active":true,"variation_is_visible":true,"weight":".3 lbs","weight_html":".3 lbs","step":1,"input_value":1},{"attributes":{"attribute_size":"Large"},"availability_html":"<p class=\"stock in-stock\">In stock<\/p>\n","backorders_allowed":false,"dimensions":"N\/A","dimensions_html":"N\/A","display_price":25,"display_regular_price":25,"image":{"title":"Madcap-VNeckTee-Grid-Retina","caption":"","url":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","alt":"Madcap-VNeckTee-Grid-Retina","src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png","srcset":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png 450w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-300x288.png 300w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-768x736.png 768w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-505x484.png 505w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png 960w","sizes":"(max-width: 450px) 100vw, 450px","full_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","full_src_w":960,"full_src_h":920,"thumb_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-120x120.png","thumb_src_w":120,"thumb_src_h":120,"src_w":450,"src_h":431},"image_id":"5823","is_downloadable":false,"is_in_stock":true,"is_purchasable":true,"is_sold_individually":"no","is_virtual":false,"max_qty":"","min_qty":1,"price_html":"","sku":"","variation_description":"","variation_id":653,"variation_is_active":true,"variation_is_visible":true,"weight":".3 lbs","weight_html":".3 lbs","step":1,"input_value":1}]" current-image="5823">
<table class="variations" cellspacing="0">
<tbody>
<tr>
<td class="label"><label for="size">Size</label></td>
<td class="value">
<div class="desktop-only" id="radio"><div><input type="radio" name="attribute_size" value="Small" id="size_v_Small" disabled="disabled"><label for="size_v_Small">Small</label><input type="hidden" name="radio_variation_id" value="655"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=655&attribute_size=Small"></div><div><input type="radio" name="attribute_size" value="Medium" id="size_v_Medium" disabled="disabled"><label for="size_v_Medium">Medium</label><input type="hidden" name="radio_variation_id" value="654"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=654&attribute_size=Medium"></div><div><input type="radio" name="attribute_size" value="Large" id="size_v_Large" checked="checked"><label for="size_v_Large">Large</label><input type="hidden" name="radio_variation_id" value="653"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=653&attribute_size=Large"></div><div><input type="radio" name="attribute_size" value="Extra Large" id="size_v_Extra Large"><label for="size_v_Extra Large">Extra Large</label><input type="hidden" name="radio_variation_id" value="652"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=652&attribute_size=Extra+Large"></div></div><a class="reset_variations" href="#">Clear</a> </td>
</tr>
</tbody>
<div class="mobile-only" id="drop"><select id="size"><option>Small</option><option>Medium</option><option>Large</option><option>Extra Large</option></select></div></table>
<div class="single_variation_wrap">
<div class="woocommerce-variation single_variation" style="">
<div class="woocommerce-variation-description">
</div>
<div class="woocommerce-variation-price">
</div>
<div class="woocommerce-variation-availability">
<p class="stock in-stock">In stock</p>
</div>
</div><div class="woocommerce-variation-add-to-cart variations_button woocommerce-variation-add-to-cart-enabled">
<div class="quantity_select" style="float: left;">
<select name="quantity" class="qty" title="Qantity">
<option selected="selected" value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div> <button type="submit" class="single_add_to_cart_button button alt">Add to cart</button>
<input type="hidden" name="add-to-cart" value="651">
<input type="hidden" name="product_id" value="651">
<input type="hidden" name="variation_id" class="variation_id" value="653">
</div>
</div>
</form>
</div>
此处的选择与另一个选项相同：
<div class="av-woo-purchase-button avia-builder-el-16 el_after_av_hr avia-builder-el-last "><p class="price"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>25.00</span></p>
<form class="variations_form cart" method="post" enctype="multipart/form-data" data-product_id="651" data-product_variations="[{"attributes":{"attribute_size":"Extra Large"},"availability_html":"<p class=\"stock in-stock\">In stock<\/p>\n","backorders_allowed":false,"dimensions":"N\/A","dimensions_html":"N\/A","display_price":25,"display_regular_price":25,"image":{"title":"Madcap-VNeckTee-Grid-Retina","caption":"","url":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","alt":"Madcap-VNeckTee-Grid-Retina","src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png","srcset":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png 450w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-300x288.png 300w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-768x736.png 768w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-505x484.png 505w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png 960w","sizes":"(max-width: 450px) 100vw, 450px","full_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","full_src_w":960,"full_src_h":920,"thumb_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-120x120.png","thumb_src_w":120,"thumb_src_h":120,"src_w":450,"src_h":431},"image_id":"5823","is_downloadable":false,"is_in_stock":true,"is_purchasable":true,"is_sold_individually":"no","is_virtual":false,"max_qty":"","min_qty":1,"price_html":"","sku":"","variation_description":"","variation_id":652,"variation_is_active":true,"variation_is_visible":true,"weight":".3 lbs","weight_html":".3 lbs","step":1,"input_value":1},{"attributes":{"attribute_size":"Large"},"availability_html":"<p class=\"stock in-stock\">In stock<\/p>\n","backorders_allowed":false,"dimensions":"N\/A","dimensions_html":"N\/A","display_price":25,"display_regular_price":25,"image":{"title":"Madcap-VNeckTee-Grid-Retina","caption":"","url":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","alt":"Madcap-VNeckTee-Grid-Retina","src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png","srcset":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-450x431.png 450w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-300x288.png 300w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-768x736.png 768w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-505x484.png 505w, https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png 960w","sizes":"(max-width: 450px) 100vw, 450px","full_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina.png","full_src_w":960,"full_src_h":920,"thumb_src":"https:\/\/madcapcoffee.com\/wp-content\/uploads\/2017\/07\/Madcap-VNeckTee-Grid-Retina-120x120.png","thumb_src_w":120,"thumb_src_h":120,"src_w":450,"src_h":431},"image_id":"5823","is_downloadable":false,"is_in_stock":true,"is_purchasable":true,"is_sold_individually":"no","is_virtual":false,"max_qty":"","min_qty":1,"price_html":"","sku":"","variation_description":"","variation_id":653,"variation_is_active":true,"variation_is_visible":true,"weight":".3 lbs","weight_html":".3 lbs","step":1,"input_value":1}]" current-image="5823">
<table class="variations" cellspacing="0">
<tbody>
<tr>
<td class="label"><label for="size">Size</label></td>
<td class="value">
<div class="desktop-only" id="radio"><div><input type="radio" name="attribute_size" value="Small" id="size_v_Small" disabled="disabled"><label for="size_v_Small">Small</label><input type="hidden" name="radio_variation_id" value="655"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=655&attribute_size=Small"></div><div><input type="radio" name="attribute_size" value="Medium" id="size_v_Medium" disabled="disabled"><label for="size_v_Medium">Medium</label><input type="hidden" name="radio_variation_id" value="654"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=654&attribute_size=Medium"></div><div><input type="radio" name="attribute_size" value="Large" id="size_v_Large" checked="checked"><label for="size_v_Large">Large</label><input type="hidden" name="radio_variation_id" value="653"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=653&attribute_size=Large"></div><div><input type="radio" name="attribute_size" value="Extra Large" id="size_v_Extra Large"><label for="size_v_Extra Large">Extra Large</label><input type="hidden" name="radio_variation_id" value="652"><input type="hidden" class="add-to-cart-url" value="https://madcapcoffee.com/?add-to-cart=651&variation_id=652&attribute_size=Extra+Large"></div></div><a class="reset_variations" href="#" style="visibility: visible; display: inline;">Clear</a> </td>
</tr>
</tbody>
<div class="mobile-only" id="drop"><select id="size"><option>Small</option><option>Medium</option><option>Large</option><option>Extra Large</option></select></div></table>
<div class="single_variation_wrap">
<div class="woocommerce-variation single_variation" style="">
<div class="woocommerce-variation-description">
</div>
<div class="woocommerce-variation-price">
</div>
<div class="woocommerce-variation-availability">
<p class="stock in-stock">In stock</p>
</div>
</div><div class="woocommerce-variation-add-to-cart variations_button woocommerce-variation-add-to-cart-enabled">
<div class="quantity_select" style="float: left;">
<select name="quantity" class="qty" title="Qantity">
<option selected="selected" value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div> <button type="submit" class="single_add_to_cart_button button alt">Add to cart</button>
<input type="hidden" name="add-to-cart" value="651">
<input type="hidden" name="product_id" value="651">
<input type="hidden" name="variation_id" class="variation_id" value="652">
</div>
</div>
</form>
</div>
答案 0 :(得分：0)
因为点击.val()与所选选项的.text()匹配的广播输入，我只是将选项中的.click()传递给匹配的单选按钮。