javascript - Jquery 绑定(bind)事件不响应

标签 javascript jquery ruby-on-rails ruby unobtrusive-javascript

我试图在按下按钮时基本上增加和减少投票计数(我已经简化了情况以利用我的错误);我用点击事件绑定(bind)了两个不同的按钮;但是,我无法从它们中得到任何响应(使用 Firebug 进行测试)。

Jquery 代码:

//This Code is located within Application.js (Rails)
$(document).ready(function() {
    $('.buttonUp').bind('click', function() {
        var voting_element = $(this).closest('.current_vote');
        voting_element.text( Number(voting_element.text()) + 1 );
    });
    $('.buttonDown').bind('click', function() {
        var voting_element = $(this).closest('.current_vote');
        voting_element.text( Number(voting_element.text()) - 1 );
    });
});

每个具有buttonUp或buttonDown类的按钮都位于包含单个提交按钮的表单中。

我在 Rails 3.1.3 中执行此操作并使用以下版本的 Jquery 库:

Jquery-Rails => 1.0.12
Jquery => 1.6.1
JqueryUI => 1.8.12
JqueryUJS => 上面 Jquery-Rails 附带的那个。

Live 也不起作用,我没想到它会起作用,因为我在将方法绑定(bind)到按钮之前等待文档加载。

这是相关 HTML 的片段。

<tr>
    <td>pop</td>
    <td>pop</td>
    <td><a href="/posts/12">Show</a></td>
    <td><a href="/posts/12/edit">Edit</a></td>
    <td><a href="/posts/12" data-confirm="Are you sure?" data-method="delete" rel="nofollow">Destroy</a></td>
    <td><p>
      <b>votes: </b>
    </p>
      <p class="current_vote">
        1
      </p>
      <form action="/posts/increaseVote?id=12" class="button_to" data-remote="true" data-type="json" method="post"><div><input class="buttonUp" type="submit" value="increaseVote" /><input name="authenticity_token" type="hidden" value="TxEGwONzSD+tnJ19iHMdGjuCBJMFoNJdECEspDtZxxY=" /></div></form>
      <form action="/posts/decreaseVote?id=12" class="button_to" data-remote="true" data-type="json" method="post"><div><input class="buttonDown" type="submit" value="decreaseVote" /><input name="authenticity_token" type="hidden" value="TxEGwONzSD+tnJ19iHMdGjuCBJMFoNJdECEspDtZxxY=" /></div></form>
  </tr>

最佳答案

要找到正确的方向,请查看此 DEMO .

这是 JS:

$(document).ready(function() {

    function vote(el, amt) {
        var $counter = $(el).siblings('.counter');
        $counter.text(parseInt($counter.text(), 10) + amt);
    }

    $('.voteUp').bind('click', function() {
        vote(this, 1);
    });

    $('.voteDown').bind('click', function() {
        vote(this, -1);
    });

});​

关于javascript - Jquery 绑定(bind)事件不响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11891822/

相关文章:

ruby-on-rails - 如何在 View 中显示散列中的特定键值对?

javascript - 浏览器之间不一致的 window.onerror 返回 true/false - 任何可用的正确返回值列表?

javascript - 如何使用 dynDateTime 从文本框中获取文本

javascript - Javascript 链式菜单的下拉显示问题

jquery - 在 chrome bootstrap 中添加网站名称

javascript - 链接或分组多个 JavaScript 函数调用,其中操作顺序有时很关键

ruby-on-rails - bluehost 使用 htaccess 共享 ssl 重定向

javascript - 使用 angularjs 将一个数组数据添加到另一个数组中

javascript - 组件的 JavaScript 不会在使用 React 路由器的路由上执行

ruby-on-rails - 捆绑exec rake db:迁移成功,但development.sqlite3为空