我首先初始化外部选择器的变量,以缩小代码,然后使用它创建一个函数。当我使用未初始化的选择器时它很好但是当我使用变量时它不再工作了。
继承我的代码:
var modalId = 'myModal',
baseModal = $('#' + modalId),
modalTitle = $('#' + modalId + ' .modal-title'),
modalContent = $('#' + modalId + ' .modal-body');
function modalCont(title, content){
modalTitle.html('');
modalContent.html('');
modalTitle.append( title );
modalContent.append( content );
baseModal.modal();
}
$(document).ready(function(){
$(document).on('click', '.option', function(e){
e.preventDefault();
var id = $(this).parents('ul').data('id'),
process = $(this).data('process');
var data = {
id : id,
process : process
}
$.ajax({
type: "POST",
url: "/ajax",
cache: false,
dataType: 'json',
data: data,
success: function( msg ) {
[Working]
/*
$('#' + modalId + ' .modal-title').html('');
$('#' + modalId + ' .modal-body').html('');
$('#' + modalId + ' .modal-title').append( 'Current User' );
$('#' + modalId + ' .modal-body').append( msg.html );
$('#' + modalId).modal();
*/
[Not Working]
modalCont('Current User', msg.html);
},
error: function( response ) {
console.log( response );
}
});
});
});
如果您对ajax有一些很好的实现技巧,请告诉我。因为目前我将处理许多ajax请求。
答案 0 :(得分:3)
我建议您使用最新版本的jQuery.ajax()查看http://api.jquery.com/jQuery.ajax/,要为jQuery.ajax()最终更改准备代码,请使用jqXHR.done(),jqXHR.fail(),和jqXHR.always()相反。在以前的URL中解释。 在您的代码中,问题可能是在应用选择器时DOM中没有元素,您需要检查baseModal是否为空。
var modalId = 'myModal',
baseModal = $('#' + modalId),
console.log('baseModal = ',baseModal);
modalTitle = $('#' + modalId + ' .modal-title'),
console.log('modalTitle = ',modalTitle );
modalContent = $('#' + modalId + ' .modal-body');
console.log('modalContent = ', modalContent);
问候。
答案 1 :(得分:1)
初始化baseModal等时,选择器中引用的元素是否已经存在?如果没有,baseModal等将是空的,并且它们不会在以后被神奇地填充。您需要再次执行选择器,因为工作代码确实如此。