时间戳

首页 > 解决方案 > 如何在 ruby​​ 中使用 jquery 变量？

javascript - 如何在 ruby​​ 中使用 jquery 变量？

问题描述

当我尝试访问 ruby​​ 中的 javascript 变量时，它显示未定义的变量错误。

我试图访问红宝石代码“phone#{x}”中的变量x

变量 x = 1;

$(add_button).click(function(e){ //on add input button click
  e.preventDefault();
  if(x < max_fields){ //max input box allowed

    x++;

    $(wrapper).append('<div class="sampleclass"><%= f.label :"phone#{x}", class: "control-label col-md-3" %><div class="col-md-8"><%= f.text_field :"phone#{x}", class: "form-control" %><a href="#" class="remove_field">Remove</a></div></div>'); //add input box
  }
});

我希望输出 phone#{x} 到 phone2

标签： javascriptruby-on-railsruby

解决方案

您的期望完全错误 - Ruby (ERB) 在服务器上执行，而此 javascript 稍后在客户端上执行。

您无法在 javascript erb 模板中动态读取 javascript 变量。它只是字符串插值的高级版本，它以与 HTML 相同的方式呈现 javascript。它实际上并不执行生成的代码。

更好的选择是使用 ERB 生成模板字符串并使用 javascript 修改元素。

var x = 1;
$(add_button).click(function(e){ //on add input button click
  var $template = $('<div class="sampleclass"><%= f.label :phone", class: "control-label col-md-3" %><div class="col-md-8"><%= f.text_field :phone, class: "form-control" %><a href="#" class="remove_field">Remove</a></div></div>');
  e.preventDefault();
  if(x < max_fields){ //max input box allowed
    x++;
    $template.find('label').text("phone " + x);
    $template.find('input').attr(name: "phone_" + x);
    $(wrapper).append(template); //add input box
  }
});

推荐阅读