Javascript将文本从第一个text_field添加到第二个text_field，然后转换为段塞

Question

我试图添加一个javascript侦听器：

1. 侦听文本字段中的文本更改(#articleField)
2. 将文本转换为弹格
3. 将新的段塞放入另一个文本字段(#slugField)

我正在使用Rails 4，我正在从this question:中提取段塞逻辑

视图

  <%= f.input :article, label: 'Article', required: true, focus: true, id: 'articleField' %>
  <%= f.input :slug, label: 'Slug', required: true, focus: true, id: 'slugField' %>
  <%= f.button :submit, value: 'SAVE CHANGES' %>'



 <script>
$('#articleField').blur(  
   function(){    
      var article = $(this).text();
      var slug = article.trim().toLowerCase().replace(" ", "_");
      $(this).prop('id', slug);
      $(slug).append(#slugField); <---this is where I'm going off the road
    } 
  )
// </script>

我对JS很陌生，在如何用函数中创建的段塞添加#slugField文本框时遇到了问题。

Answer 1

首先，您的javascript代码是否在document ready指令中？

<script type="text/javascript">
  $(function() {
    // Your code should be here
  });
</script>

其次，可以使用jQuery val方法在text_field中设置文本。

$('#articleField').blur(function() {
  var article = $(this).val();
  var slug = article.trim().toLowerCase().replace(" ", "_");
  $("#slugField").val(slug);
});

Answer 2

为了创建弹格，我使用了一个jquery插件，它非常好地使用了http://pid.github.io/speakingurl/中的speakingurl

现在我的代码中，我得到了变更和键控方法上的段塞，根据输入值得到了段塞，并将它分配给其他字段。

$(document).on('keyup change','#username', function(){
    var slug = getSlug($(this).val());
    $('#user-slug').val(slug);
    //looking for optimization
    delete slug;
});

希望你能理解。