当我在HTML5中按“颜色”类型时会触发哪个事件

Question

我试图使用Ajax将颜色的十六进制值存储到我的产品表中，而无需单击按钮。我尝试过使用change和click事件，但在这种情况下它们都不起作用。我想知道我应该使用哪个事件来获取使用Ajax（Jquery）的值（十六进制）值。

$(document).on("click", "#prod_color", function(event){
	event.preventDefault();
	var a=$("#prod_color").val();
	console.log(a);
})	

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
  <th>Color</th>
    <td><input type="color" name="color" id="prod_color"></td>
  </tr>

Answer 1

这是change。虽然它只会在颜色值实际发生变化时触发，这意味着如果你试图使用颜色图并且值总是为#000000那么它就不会触发变化。

$(document).on("change", "#prod_color", function(event) {
  var a = $("#prod_color").val();
  console.log(a);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="color" name="color" id="prod_color">