【问题标题】:jQuery does not fire on second clickjQuery 不会在第二次点击时触发
【发布时间】:2014-04-16 12:37:13
【问题描述】:

我无法弄清楚为什么 jQuery 在我第二次单击该按钮时没有触发。我一无所知,如果您需要更多代码或其他任何内容,请询问。

HAML:

包含按钮的详细信息容器(%input.newRemark.newEntity.tm_button{:type => "button", :value => "New"}):

.detail_header_container.remark
.red_title.detail_header.open#explore_management-configurationremarks_header="Remarks"
%input.newRemark.newEntity.tm_button{:type => "button", :value => "New"}
%div.listingContainer            
  .entityDetailsContainer      
    %table.configDetails{:class => "configuration-#{entity.id}"}
      %thead
        %tr
          %th{:style => "width:25%"} Date
          %th{:style => "width:65%"} Remark
          %th{:style => "width:10%h"} Actions
      %tbody
        - ConfigurationRemark.where(:access_line_id => entity.access_line_id).sort(:created_at).each do |remark|       
          = render(:haml, :"explore_management/configurationremark_record", :locals => {:entity => remark})

jQuery 不会触发第二次的模态:

-# ModalContent
%div{:id => "add_remark_modal"}
  %h1 Add remark to Access ID: #{entity.access_line_id}
  %div.formErrors
  %form.remarkForm#explore_management-configurationremarks_form{:action => "explore_management/configurationremarks",  :method => "POST"}
    %input{:type => "hidden", :name => "_method", :value => "POST"}
    %input{:type => "hidden", :name => "access_line_id", :value => entity.access_line_id, :name => "entity[access_line_id]"}
    %input{:type => "hidden", :name => "isFirst", :value => isFirst, :name => "config[isFirst]"}
    %input{:type => "hidden", :name => "isLatest", :value => isLatest, :name => "config[isLatest]"}
    %input{:type => "hidden", :name => "entity_index", :value => entity_index, :name => "config[entity_index]"}
    %input{:type => "hidden", :name => "entity_array", :value => entity_array, :name => "config[entity_array]"}
    %div
      %label{:for => "remark"} Remark:
      %input{:id => "remark", :type => "text", :name => "entity[remark]"}

    %div#entityFormSubmit
      %input.tm_button.add_remark{:type => "submit", :value => "Save"}

jQuery:

// Click-event for dynamically added new-button(s) 
$(document).on('click', '.newRemark', function(event){
    // Open Remark popup
    $("#add_remark_modal").modal();

    // Set remark form save functions
    onRemarkFormLoadSuccess();      
});

function onRemarkFormLoadSuccess(data) {
    var method = $(".remarkForm").find('input[name="_method"]').val();
    var remarkFormOptions = { dataType: "html", 
                              method: "POST",
                              success: onRemarkSaveSuccess,
                              error: onRemarkSaveError                          
                            };
    $(".remarkForm").ajaxForm(remarkFormOptions);   
}

function onRemarkSaveSuccess(record_html, statusText, jqXhr, jqForm) {
    //remove form
    $("#simplemodal-overlay").remove();
    $("#simplemodal-container").remove();

    var headerId = jqForm.attr('id').replace('_form', '_header');
    var $listingContainer = $("#" + headerId).parent().find(".listingContainer");
    var $tableBody = $("#" + headerId).parent().find("table.configDetails tbody");
    //append new record
    $tableBody.find("tr.nothingFound").remove();
    var $newRecord = $(record_html).appendTo($tableBody);

    //fade in$

    $newRecord.hide();
    $newRecord.css('background-color', '#FFFF66');
    $newRecord.fadeIn(1000, function() { $newRecord.css('background-color', 'inherit');});

    registerRecordActionHandlers($newRecord);

}

function onRemarkSaveError() {

    alert("error");

}

function registerRecordActionHandlers($record) {
        $record.click(onRecordClick);
        $record.find(".recordActions a").click(onRecordActionClick);
}

视觉:

为了更好地理解一些视觉效果:


【问题讨论】:

  • 控制台是否显示错误?
  • 您应该提供与您的问题相关的相关代码。顺便说一句,哪个处理程序给您带来问题?
  • @AnoopJoshi 控制台中什么都没有,我也尝试过使用 firebug。
  • @A.Wolff 你检查他的成功处理程序了吗?他在没有参数的情况下调用函数,但实际函数有 4 个参数。那是问题吗?我不熟悉这种类型的函数调用。
  • @MichielG 有在线链接吗?没有被解雇,你的意思是即使在处理程序内部设置一个 alert() 也不起作用?

标签: jquery onclick click haml


【解决方案1】:

我已将以下行添加到我的 onClick() 处理程序中。它关闭其余打开的模式。我第一次单击时没有打开模式,但我并没有给出这么好的错误。

$.modal.close();

处理程序:

// Click-event for dynamically added new-button(s) 
$(document).on('click', '.newRemark', function(event){

    //Close 
    $.modal.close();

    // Open Remark popup
    $("#add_remark_modal").modal();

    // Set remark form save functions
    onRemarkFormLoadSuccess();      
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-10-24
    • 2019-09-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多