需要从表单中获取Selected Option值,并通过jquery/javascript返回
Need to grab Selected Option value from a form and pass back via jquery/javascript
我需要动态获取用户选择的任何选项的值,并在点击按钮时将该值传回Facebook像素。
请参阅脚本区域中的SELECTED OPTION VALUE。
<form action="/cart/add" method="post" enctype="multipart/form-data" class="AddToBagForm text-center medium-up--text-left" novalidate>
<select name="id" id="product-select-2585865157" class="product-single__variants">
<option selected="selected" value="7534116741">White Marble / S - $39.95 USD</option>
<option value="7534116869">White Marble / L - $39.95 USD</option>
<option value="7534117061">Midnight / S - $39.95 USD</option>
<option value="7534117253">Midnight / L - $39.95 USD</option>
<option value="9032311493">Maroon / M - $39.95 USD</option>
<option value="9032318853">Maroon / L - $39.95 USD</option>
</select>
<div class="add-container clearfix">
<a href="#" class="btn--primary BIS_trigger" data-product-handle="mighty-ganesh-flowy-top" data-variant-id="7534116741">Get Notified</a>
<div class="quantity-field">
<label for="Quantity" class="quantity-selector">Qty:</label>
<input type="number" id="Quantity" name="quantity" value="1" min="1" max="3" class="quantity-selector">
</div>
<button type="submit" name="add" class="AddToBag btn--primary" id="add-to-cart" >
<span class="AddToBagText">Add to Bag</span>
</button>
</div>
<script type="text/javascript">
$('#add-to-cart').click(function() {
fbq('track', 'AddToCart', {
content_ids: '{{ product.id }}.' + **SELECTED OPTION VALUE**,
content_type: 'product',
value: {{ product.price | money_without_currency}},
});
});
</script>
</form>
您可以通过jQuery的.val()
函数获得select
元素的选定选项值,因为您已经使用了该库。
$('#product-select-2585865157').val()
或者,由于似乎生成了id
:$('select.product-single__variants').val()
您的最终JavaScript应该是这样的:
$('#add-to-cart').click(function() {
var selection = $('#product-select-2585865157').val();
/* var selection = $('select.product-single__variants').val(); */
fbq('track', 'AddToCart', {
content_ids: '{{ product.id }}.' + selection,
content_type: 'product',
value: {{ product.price | money_without_currency}},
});
});
相关文章:
- jquery返回边距为0的绝对中心
- 如何使用jquery返回php-json数组对象
- Firefox使用JQuery返回不正确的JSON
- 当jQuery返回错误时,如何在jQuery中重新发送ajax请求
- jquery返回ajax响应和用户定义的变量到函数
- 如何从ajax调用JQuery返回数据
- 单击按钮时Jquery返回到父函数
- jQuery返回prevObject..有时
- 使用String.FromCharCode时,jQuery返回未定义的结果
- jQuery返回多个函数;不起作用
- 正在读取嵌套json,jquery返回undefined
- IE使用类jquery返回相同的最后一个单选按钮值
- 在数组中循环,jQuery返回undefined
- 从php向jquery返回jsonencode错误
- .children()不适用于jquery返回的指定索引
- HTML 复选框 Click() 使用 jQuery 返回 FALSE 或 TRUE,而不是 READONLY 或 DI
- 使用 jQuery 返回除 Drupal7 表单之外的所有点击事件的消息
- 排序 Jquery 返回的 HTML 元素
- jQuery 返回空字符串作为 ID 表示
- jQuery返回所有页面已禁用,然后启用