javascript - onclick 将数据传递给 javascript

Question

我有一个链接，单击该链接时应将 rails 变量分配给 JavaScript 变量。然后使用 JavaScript 计算价格。我目前使用硬编码值计算价格。

在 html 中，我需要 data-price 在 js 中为 var blankPrice。任何帮助都会很棒。

$("a.shirt-color-link").on("click", function(){
  calculatePrice($(this));
})
 function calculatePrice(){

 	var blankPrice = obj.attr("data-price");


 	console.log(blankPrice)
 	var pricePerSide = 3;

 	var printedSides = 0;

 	if (frontCanvas) {
 		var frontCanvasJson = JSON.parse(frontCanvas);
		
		if (frontCanvasJson && frontCanvasJson.objects.length > 0)
			printedSides++;
 	}

 	if (backCanvas) {
		var backCanvasJson = JSON.parse(backCanvas);

	 	if (backCanvasJson && backCanvasJson.objects.length > 0)
	 		printedSides++;
 	}

 	var total = blankPrice + (pricePerSide * printedSides);
 	$('.base-price').text('$' + total);
 }

<a 
   tabindex="-1" 
   data-original-title="<%= shirt_color.color_name.titleize %>"
   class="shirt-color-link" 
   data-color="#<%= shirt_color.hex %>" 
   data-price="<%= product.base_price %>" 
   data-product-id="<%= product.id %>">
</a>

Answer 1

链接元素的点击处理程序在哪里？

您可以在 jQuery 中执行以下操作:首先向链接添加点击处理程序:

$("a.shirt-color-link").on("click", function(){
   calculatePrice($(this));
})

然后在 calculatePrice 中添加参数 obj 并将 var blankPrice = 5; 替换为:

var blankPrice = obj.attr("data-price");

obj 指的是被点击的链接，它是data-attributes。