1

我确信有一个简单的解决方案，但到目前为止它一直在逃避我。我正在尝试使用 jqueryui 从函数中打开模式窗口，但失败并显示消息“对话框不是函数”。最终，我将使用通过 ajax 拉取的内容来填充模态，但我已将其剥离到最简单的部分以找出为什么我无法实例化模态窗口。我正在使用来自 google CDN 的 jquery 1.7.2 和 jqueryui 1.8.18。

<!-- as a link -->
<a href="javascript:view_log('1');">Log 1</a>

<!-- as a button -->
<input type="button" id="thebutton" value="View Log" />

<script type="text/javascript">

/* this works on page load */
var test1 = $(document.createElement('div'));
test1.dialog({ modal:true });
test1.html('Testing');

/* this also works (on page load) */
function displayModal(content) {
    var newDiv = $(document.createElement('div'));
    newDiv.dialog({ modal:true });
    newDiv.html(content);
}
displayModal('Testing by calling displayModal() function');

/* this fails with error "newDiv.dialog is not a function" */
function view_log(id) {
    displayModal('Log for id ' + id);
}

/* this also fails, same error ... */
$('#thebutton').bind('click', function() {
    displayModal('Testing again...');
});

</script>

任何 jquery 专家可以指出我的错误？

谢谢！

4

1 回答 1

1

它对我来说很好。我唯一能想到的是你应该使用$(document).ready(function() {}); 

$(document).ready(function() {
    $('#thebutton').bind('click', function() {
        displayModal('Testing again...');
    });
});

现场演示

于 2012-06-28T19:04:19.060 回答