在过去的几天里,我花了好几个小时尝试我能找到的几乎所有 Stack Overflow 代码片段来自己破解它,但没有任何东西能像我需要的那样工作。在这个阶段,我希望你们中的一位能帮助我。
客观的:
我有一个订单单上显示的单选按钮列表。我只想从选中的无线电输入中提取特定标签内容并将其保存到一个变量中,即“3 产品名称”或“1 产品名称”。
$("input:radio").click(function() {
var label_description = this.parentElement.outerText;
alert(label_description);
});
//Goal- Extract specific label content from checked radio input e.g "3 Product Name" or "1 Product Name"
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pull-left elOrderProductOptinProductName">
<input type="radio" id="lbl-01" name="purchase[product_id]" value="12374747">
<div class="pull-right elOrderProductOptinPrice" data-cf-product-price="true" taxamo-currency="USD">$X.XX</div>
<label for="lbl-01" data-cf-product-name="true">3 Product Name - Text here</label>
</div>
<div class="pull-left elOrderProductOptinProductName">
<input type="radio" id="lbl-01" name="purchase[product_id]" value="839909">
<div class="pull-right elOrderProductOptinPrice" data-cf-product-price="true" taxamo-currency="USD">$X.XX</div>
<label for="lbl-01" data-cf-product-name="true">4 Product Name - Text here</label>
</div>
<div class="pull-left elOrderProductOptinProductName">
<input type="radio" id="lbl-01" name="purchase[product_id]" value="839909">
<div class="pull-right elOrderProductOptinPrice" data-cf-product-price="true" taxamo-currency="USD">$X.XX</div>
<label for="lbl-01" data-cf-product-name="true">6 Product Name - Text here</label>
</div>
<div class="pull-left elOrderProductOptinProductName">
<input type="radio" id="lbl-01" name="purchase[product_id]" value="839909">
<div class="pull-right elOrderProductOptinPrice" data-cf-product-price="true" taxamo-currency="USD">$X.XX</div>
<label for="lbl-01" data-cf-product-name="true">1 Product Name</label>
</div>
JS小提琴:http : //jsfiddle.net/1t1edf8v/5/
如您所见,我所拥有的只是提取完整标签内容和价格的工作代码。我明白为什么会发生这种情况,我只是无法隔离我需要的东西。
非常感谢您对此的任何帮助!
简单地,使用 querySelector:
alert(this.parentElement.querySelector("[data-cf-product-name]").outerText)
更新小提琴:http : //jsfiddle.net/1t1edf8v/3/
请注意,我在 querySelector函数中使用了属性选择器,如果您愿意,可以使用其他一些选择器。
要仅提取字符串“3 产品名称”或任何其他字符串,您可以使用 split 函数或 regEx。你只需要一些模式在这里。
例如,
var text = this.parentElement.querySelector("[data-cf-product-name]").outerText;
var selected = (text.split("-"))[0].trim();
alert(selected);
更新小提琴:http : //jsfiddle.net/1t1edf8v/8/
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句