Question

我在铁轨上使用红宝石。我有一个使用form_for和textarea创建的表单。单击文本区域时，我希望textarea的高度变大。来自asp.net mvc背景，我想在文本区域添加一个onClick事件，然后使用jquery将高度px添加到文本区域。我正在努力研究如何使用rails：

<%= form_for(@person) do |f| %>
    <%= f.label :name %>
    <%= f.text_field :title, class: 'form-control' %>
    <br/>
    <div class="text">
        <%= f.text_area :notes, placeholder: "add notes here...", id: "tester"%>
    </div>
    <%= f.submit "Post", class: "btn btn-primary" %>
<% end %>

我设法添加了“测试人员”的ID。到text_area。然后我将此代码放在application.js文件中：

$(document).ready -> {
    $('#tester').bind('click', function() {
        $('#tester').style.height = "200px";
    });
}

我从rails文档中得到了这个想法：http://guides.rubyonrails.org/working_with_javascript_in_rails.html 但是，这似乎根本不会触发click事件。如何在轨道上实现这一目标？注意：我不熟悉咖啡脚本，宁愿使用香草js。

Answer 1

您的元素实际上没有id“tester”。 Rails根据您正在处理的对象为它创建另一个id。尝试将您的javascript中的$('#tester')更改为$('.text textarea')，我认为它会有效。

Answer 2

我发现了答案。我的代码实际上只是在语法上有错误。以下是javascript代码的正确语法：

$( document ).ready(function() {
    $('#tester').bind('click', function() {
        $('#tester').attr("rows", "15");
    });
});

我最初为form_for编写的代码是正确的

Answer 3

将tester()函数绑定到onclick textarea。当用户点击textarea时，系统会触发tester()。

<%= f.text_area :notes, placeholder: 'add notes here...', onclick: 'tester()'%>

$( document ).ready(function() {
  function tester() {
    $(this).css('height', '200px');
  });
}

如何在form_for textarea元素

3 个答案: