如何使用变量在coffeescript中设置jQuery选择器？

Question

我正在编写一个Rails应用程序，并且在同一页面上有多种形式的表单都具有不同的ID。 在咖啡脚本中，我试图设置标识符以访问每个文本区域。 这是html在浏览器中的外观的快速示例。

的HTML

<a href="#" class="link" data-plan="1">Click here</a>
<form id="new_item_plan_1">
  <textarea id="plan_1_item_field"></textarea>
</form>

设置计划ID并尝试访问文本区域

plan_id = 0
$(".link").click ->
  plan_id = $(this).data("plan")
$("#plan_"+plan_id+"_item_field").keypress ->
  ...Some code...

因此，我先初始化了plan_id变量，然后将其设置为.link的数据计划值。 但是我的按键事件在textarea上不起作用，并且在控制台中没有出现错误。

当我建立测试链接并进行console.log时...

plan_id = 0
$(".link").click ->
  plan_id = $(this).data("plan")
$("#test).click ->
  console.log(plan_id)

它会在控制台中正确打印正确的plan_id值，因此我必须在textarea标识符中做错了什么。 我怎么了 谢谢。

链接到jsfiddle，注意keypress事件如何不起作用https://jsfiddle.net/cfscr/175/

Answer 1

<a href="#" class="link" data-plan="1">Click here</a>
<form id="new_item_plan_1">
  <textarea id="plan_1_item_field" class='item-field' data-plan='1'></textarea>
</form>

plan_id = 0
$(".link").click ->
  plan_id = $(this).data("plan")
$(".item-field").keypress ->
  if $(this).data('plan') == plan_id {
     ...Some code...

您可以在文本区域中使用正则表达式而不是其他data标签，我只是懒惰;）

Answer 2

您的代码中发生的是按键绑定是在页面加载时应用的，因此仅在计划ID仍为0时才应用一次。在plan_id更新时，它不会重新应用。

我应该注意，这样做似乎很奇怪，但是您需要将绑定放入click事件中。 也就是说，你想要

$("#plan_"+plan_id+"_item_field").keypress ->
  ...Some code...

在每次触发click事件时应用。 为此，必须正确缩进

plan_id = 0
$(".link").one 'click', ->
  plan_id = $(this).data("plan")
  $("#plan_"+plan_id+"_item_field").keypress ->
    ...Some code...

这样可以使用户多次单击按钮时，会将绑定应用于该按键。 这是您想要完成的吗？