Question

这可能是一个Ruby on Rails初学者的问题 - 我创建了一些简单的JQuery代码。

$("input[id^='show_Fulltext']").click(function(){
$("#Fulltext".concat($(this).val())).toggle();
});

然后我添加了一些HTML：

<input type='button' value='2' id='show_Fulltext2'></input> 
<input type='button' value='1' id='show_Fulltext1'></input>  
<div id="Fulltext1" style="display:none;">Substring 1</div>
<div id="Fulltext2" style="display:none;">Substring 2</div>

现在结果是我可以打开或关闭的div。 https://jsfiddle.net/z1w1p3o1/71/

这完美无缺，也是我希望它工作的原因（外部）。

接下来，我尝试在Ruby on Rails应用程序中使用此代码。我必须补充一点，我没有创建项目，因此项目中已经使用了JQuery，但我不明白为什么这个JQuery已经存在，并且我的工作不起作用：

我现在编辑了application.js文件，如下所示（基本上我将代码复制到其中）：

$(function() {
/*
 $('#content_main th a, #content_main .pagination a',).live('click', function(){
  $.getScript(this.href);
   return false;
  });
*/

  $('#search input').keyup(function() {
    $.get($('#search').attr('action'), $('#search').serialize(), null,'script');
    return false;
  });

 $('#search2 input').keyup(function() {
    $.get($('#search2').attr('action'), $('#search2').serialize(), null,'script');
    return false;
  });


  $('#search select').change(function() {
    $.get($('#search').attr('action'), $('#search').serialize(), null,'script');
    return false;
  });

  //$('#search :radio').change(function() {
    $('#search :radio').change(function() {
    $.get($('#search').attr('action'), $('#search').serialize(), null,'script');
    return false;
  });
  // HERE IS THE CODE I COPIED!! -----------
  $("input[id^='show_Fulltext']").click(function(){
   $("#Fulltext".concat($(this).val())).toggle();
  });
  //-------------------------------------

  $('#initiation_planned').datepicker({ dateFormat: "yy-mm-dd" });
  $('#initiation').datepicker({ dateFormat: "yy-mm-dd" });
  $('#first_recruitment').datepicker({ dateFormat: "yy-mm-dd" });
  $('#last_recruitment').datepicker({ dateFormat: "yy-mm-dd" });
  $('#lock_planned').datepicker({ dateFormat: "yy-mm-dd" });
  $('#arch_end').datepicker({ dateFormat: "yy-mm-dd" });
  $('#lock').datepicker({ dateFormat: "yy-mm-dd" });
});

现在，如果我在Ruby on RAILS项目中编辑HTML，如上所示（在编辑器中从外部工作），按钮不会切换div。我假设整个JS都不起作用。我编辑了一个已经包含工作JS代码的文件。我可能犯过什么错误的想法？ `

Answer 1

你很容易在没有ID的情况下实现同样的目标。

$('.module').on('click', 'button', function(){
  var $self = $(this);
  var $txt = $self.siblings('.full-text').eq($self.index());
  $txt.toggle();
});

.full-text { display: none }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="module">
  <button>Show 1</button>
  <button>Show 2</button>
  <div class="full-text">Full text 1</div>
  <div class="full-text">Full text 2</div>
</div>

Ruby on Rails - 即使它工作“外部”，JQuery也无法正常工作

1 个答案: