以下の HTML は、2 つのボタンを含むページを表示します。通常の方法で JQuery ダイアログを開き、正常に動作しています。
もう 1 つのボタンは、非 jquery 関数からダイアログ フォームを開こうとする試みですが、機能していません。2 番目のボタンを使用する方法は適切ではないことは承知していますが、ここでの説明をスキップする理由により、これが可能かどうかを知りたいですか?
私はjqueryを初めて使用するので、名前空間などについて現時点で完全に理解していない基本的なことがあると確信しています。成功せずに動作させるために多くの方法を試しましたが、これを行う方法についてアドバイスを求めています。より一般的な質問は、「通常の」JavaScript がどのように JQuery 関数を参照および操作できるかに関するものです。
それはできますか?
<!doctype html>
<html>
<head>
<title>My Dialog demo</title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var $dialog = $('<div></div>')
.html('My Dialog Demo...')
.dialog({
autoOpen: false,
title: 'My Dialog'
});
$('#Button1').click(function () {
$dialog.dialog('open');
return false; ////cancel eventbubbeling
});
});
function showDialog() {
$dialog.dialog('open');
return false //cancel eventbubbeling
}
</script>
</head>
<body>
<!-- JQuery autowired event-->
<button id="Button1">Open dialog (JQuery event wireup)</button>
<!-- Manual -->
<button id="Button2" onclick="showDialog();">Open (manual onClick event)</button>
</body>
</html>