jquery函数似乎不起作用

时间:2012-05-18 03:38:10

标签: ruby-on-rails-3 jquery

所以我有我的Rails 3.1应用程序,我使用ajax来处理登录和注销。由于我复制了一些代码(附加flash通知,更新div),我将代码移动到一个函数中,并从我的其他方法中调用该函数。如果我从函数中取出代码并将其放入方法中,但是在将代码移动到函数中之后它就不再起作用了。

data.login看起来像:json => (:login => true)

$(document).ready(function() {

  function setNotice(data) {
    var $flash = $('<div class="alert alert-success"><a class="close" data-dismiss="alert" href="#">x</a>'" + data.data.message + "'</div>');
     $('#account').html( 
      if (data.login) { 
        data.email 
      } else {
        "Account"
      });
     $('.alert').alert('close');
     $('.row').prepend($flash);
  }


  $('form#sign_in').bind('ajax:success', function(e, data, status, xhr) {
    console.log(data);
    if(data.success) {
      $('#user_login_box').html(data.content);
      setNotice(data)
    } else {
      $('#status').html(data.data.message);
    }
  });

  $('.logout').bind('click', function(e, data, status, xhr) {
   setNotice(data)
  });

});

2 个答案:

答案 0 :(得分:1)

设置$.html时,您需要使用匿名函数,return结果:

$('#account').html(function(){
  return data.login ? data.email : "Account" ;
});

您的$flash行没有正确连接:

var $flash = $('<div class="alert alert-success"><a class="close" data-dismiss="alert" href="#">x</a>' + data.data.message + '</div>');

或改写:

var $flash = $("<div>",{
  'class': 'alert alert-success',
   'html': data.data.message
});

var $link  = $("<a>",{
   'html': 'x',
  'class': 'close',
   'href': '#'
}).data("dismiss","alert").prependTo( $flash );

来自Chatroom

我们还确定注销按钮无效:

$('.logout').bind('click', function(e, data, status, xhr) {
   setNotice(data);
});

这是混淆了点击事件处理程序可用参数的结果。解决方案是更改click事件以触发异步请求以将用户注销:

$(".logout").on("click", function(e){
  e.preventDefault();
  $.post("/logout", {_method:"delete"}, function(data){
    setNotice(data);
  });
};

答案 1 :(得分:1)

以下行似乎有错误。

var $flash = $('<div class="alert alert-success"> <a class="close" data-dismiss="alert" href="#">x</a>'" + data.data.message + "'</div>');

你可以用这个替换上面的那行,让我们知道它是否已经解决了。

var $flash = $('<div class="alert alert-success"><a class="close" data-dismiss="alert" href="#">x</a>' + data.data.message + '</div>');

你能确保所有报价等都正确关闭吗?