为什么简单的 JQuery 对话框/弹出窗口不起作用

Why is simple JQuery dialog/popup not working?

本文关键字：窗口 不起作用 对话框 简单 JQuery 为什么      更新时间：2023-09-26

我把它全部放在一个页面中，它应该可以工作并且不起作用：

<html>
<head>  <link href="css_js/styles.css" rel="stylesheet" type="text/css">
    <script language="JavaScript1.2" src="css_js/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script language="JavaScript1.2" src="css_js/jquery-ui-1.8.17.custom.min.js" type="text/javascript"></script>   
    <script language="JavaScript1.2" type="text/javascript">
function popup() {
    alert('test');
    var popup = $('.newpopup');
    popup.draggable();
    popup.resizable();
    popup.html('<p>Where is pancakes house?</p>');
    popup.show('fast');
}
$('button').click(popup);
    </script>
</head>
<body>
<div class='newpopup'></div>
<button>popup</button>  
</body>
</html>

我想用Jquery制作一个简单的弹出窗口/对话框，但它根本不起作用。它有什么问题？

在 document.ready 上调用函数 

$(document).ready(function(){
  $('button').click(function(){
     popup();
  });
})

或

$(function(){
  $('button').click(function(){
     popup();
  });
})

你应该以jQuery风格运行你的函数：

$('button').click(function() { 
     popup();
     return false; //optional
 }

你确定src引用在包含jquery时是有效的吗？我已经让你的代码在这个jsfiddle上使用谷歌托管的JQuery和JQuery-ui版本运行良好。

相关文章：