gpt4 book ai didi

php - 我们如何在 PHP 中为 Jquery-ui 对话框窗口创建自定义样式?

转载 作者:太空宇宙 更新时间:2023-11-04 05:16:42 24 4
gpt4 key购买 nike

我有一个 PHP 页面,其结果表包含一个打开弹出框的链接。早些时候我使用 JavaScript。但我想隐藏地址栏,所以这不能用 JavaScript 完成(希望如此)。所以我尝试为此使用 jQuery-ui。

<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css">

<style type="text/css">
#data-specs {
border-collapse: collapse;
}
#data-specs th,
#data-specs td {
padding: 0px;
border: 0px;
}
.loading {
position: absolute;
top: 50%;
left: 50%;
margin-top: -8px;
margin-left: -8px;
}
</style>

<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 $loading = $('<img src="loading.gif" alt="loading" class="loading">');

$('#data-specs a').each(function() {
var $dialog = $('<div></div>')
.append($loading.clone());
var $link = $(this).one('click', function() {
$dialog
.load($link.attr('href'))
.dialog({
title: 'Dialog Title',
width: 500,
height: 300
});

$link.click(function() {
$dialog.dialog('open');

return false;
});

return false;
});
});
});
</script>
</head>

我的表部分代码是这样的:

print "<table width='875' id='data-specs' align='center'>";
while($row = mysql_fetch_array($result))
{
print "<tr height='18'>";
print "<td width=200 align=left style='padding-left:10px'>" . $row['Country'] . "</td>";
print "<td width=70 align=center>" . $row['MidEstimate'] . "</td>";
print "<td width=70 align=center>" . $row['LowEstimate'] . "</td>";
print "<td width=70 align=center>" . $row['HighEstimate'] . "</td>";
print "<td width=118 align=center>" . $row['Source'] . "</td>";
print "<td width=110 align=center>" . $row['StudyLocation'] . "</td>";
print "<td width=89 align=center>" . $row['Relevance'] . "</td>";
print "<td width=89 align=center>" . $row['Quality'] . "</td>";

print "<td width=61><a style='color:#E46D0A;' href='popupboxD.php?SId=$vv'>".$row['Info']."</a></td>";
print "</tr>";

}
}

if(empty($result)){

print "<table width='875' align='center'>";
print "<tr height='1'><td colspan='9'><font color='#000080'><b>Does not have information on this particular selection.</b></font></td></tr>";
print "</table>";

现在的问题是一切正常。但是当我单击链接时,jQuery 对话框打开并且我父窗口的样式 (css) 也发生了变化?我希望样式仅应用于对话框窗口我还想更改对话框窗口的外观吗?我怎样才能做到这一点?请帮助我。

更新

我在 drupal 6 中使用此代码,但是当我单击链接时,弹出窗口不会作为模态对话框窗口打开。 IT 在父窗口中完全打开?我如何使用相同的代码将 jQuery UI 合并到 drupal 6 中?请帮助我。

最佳答案

要制作您自己的 jQuery ui 样式(主题),请在 jquery ui themeroller 上进行更改。 .之后你可以下载它(在你应该取消选择所有组件之前),如果它是一个 zip 解压缩它,将文件保存在你的服务器上并替换你以下行的 href 属性:

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css">

但这将更改此页面的所有 jQuery ui 元素。

===更新===

要使对话框成为模态对话框,您必须添加 modal option .

.dialog({
...
modal: true
})

另请参阅我更新的 jsfiddle .

关于php - 我们如何在 PHP 中为 Jquery-ui 对话框窗口创建自定义样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7816877/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com