2

我在主页上有一个 jquery ui 按钮，该按钮(index.php)显示并且工作正常。在主页中，我有一个 div<div id="cardarea">用作动态内容的占位符。动态内容存储在另一个文件中(cardarea.php)，该文件中的元素的显示取决于$_GET['key'];它从主页中的输入表单中获取的变量。

现在的问题是，当我尝试<settingsbtn>在文件的部分内容中包含相同的 jquery ui 按钮 () 时cardarea.php，这不会显示。

javascript 代码和定义包含在index.php. 我猜文件中的按钮cardarea.php无法访问此信息，或者我的 javascript 定义中有错误。我尝试在文件中包含相同的 javascript 代码和定义cardarea.php，但没有效果。

我真的很不知道这里有什么问题。我将包含 javascript 定义，但我不确定还有哪些其他代码可能与解决这个问题有关。如果适用，请告诉我哪些附加信息可能有助于查找问题。谢谢。

Javascript： 

    $(function() {

$( "settingsbtn" ).button({
        icons: {
                    primary: "ui-icon-triangle-1-s"
                },
        text: false
});

}); 

</script>

索引.PHP

<?php


include 'functions.php';
include 'incl_ajax.php';


?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="css/amariffic.css" rel="stylesheet" type="text/css" />
<title>Test</title>


    <link href="css/smoothness/jquery-ui-1.10.3.custom.css" rel="stylesheet">
    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/jquery-ui-1.10.3.custom.js"></script>

    <?php include 'snip_javascript.php'; // innholder både kode og css-link. ?>

</head>



<body class="body">

<settingsbtn></settingsbtn>

<a href="javascript:ajaxpage('_cardarea.php?key=5', '_cardarea');" class='nodecor'>Show</a>

<div id="_cardarea"></div> 

</body>
</html>

CARDAREA.PHP

<?php

include 'functions.php';
$key = $_GET['key']; 


    if ($key == '5') {
        echo '<div>';
        echo 'Button: <settingsbtn> </settingsbtn>';
        echo '</div>';
    }

?>
4

2 回答 2

2

完成 AJAX 请求后，您必须再次运行您已经编写的 Javascript 函数。

您必须再次运行您的功能：

$(function() {

$( "settingsbtn" ).button({
        icons: {
                    primary: "ui-icon-triangle-1-s"
                },
        text: false
});

});

在 AJAX 调用之后，我实际上在我的 Chrome 控制台中运行了该功能，并且正确显示了第二个按钮。

只需在您的 javascript 函数中定义：

function initButtons(){
   $( "settingsbtn" ).button({
           icons: {
                       primary: "ui-icon-triangle-1-s"
                  },
           text: false
   });
}

然后使用以下命令覆盖您之前粘贴的 javascript 代码：

initButtons();

最后，您必须将此函数调用添加到 AJAX 回调函数的末尾：

initButtons();

将它放在您将从 AJAX 收到的代码附加到 HTML 的指令之后。

编辑：我看了你的代码，我看到你应该把这个函数放在这里：

function ajaxpage(url, containerid){
[...]
   page_request.onreadystatechange=function(){
   loadpage(page_request, containerid)
   initButtons();
   }
[..]
}
于 2013-05-29T18:17:08.527 回答
0

也许delegate()是您正在寻找的。

于 2013-05-29T17:20:22.913 回答