Question

我的一个视图中有一个简单的div，我想点击隐藏页面上的另一个元素。我把它放在我的application.js但它没有做任何事情。我把它放在了错误的地方吗？

function toggleNewPostForm {
    $('.new-post-btn').hide();
}

Answer 1

使用document ready确保在从HTML中选择元素并调用内部函数之前加载文档

function toggleNewPostForm(){
  $('.new-post-btn').hide();
};

$( document ).ready(function() {
  toggleNewPostForm();
});

Answer 2

尝试这样的事情

<div class="xyz">Click here!</div>

在javascript中

$(".xyz").click(function(){
  $('.new-post-btn').hide();
});

还检查文档就绪方法后是否添加了事件监听器？即

$(function(){
   $(".xyz").click(function(){
     $('.new-post-btn').hide();
   });
});

Answer 3

如果这是您拥有的唯一j，则不会有点击行为。你必须告诉元素，必须对点击事件做出反应。

在你的application.js文件中试试这个：

function toggleNewPostForm() {
    $('.new-post-btn').hide();
}

$(document).on('ready page:load', function(){
    $('.new-post-btn').on('click', function(){
        toggleNewPostForm();
    });
});

P.S。：正如RGraham所指出的，如果你定义一个函数，你必须编写参数 - paranthesis。

P.P.S。：在ruby on rails上，你应该检查'ready'和'page：load'作为文档就绪处理程序，因为Ruby on Rails默认使用“Turbolinks” - 库。

将简单的onclick js添加到rails

3 个答案: