当 AJAX 加载 jquery ui 按钮时,它被搞砸了

发布于 2024-11-02 08:42:34 字数 1980 浏览 1 评论 0原文

我的 jquery ui 按钮有问题(我认为)。
我尝试通过 AJAX 加载收件箱,我获得了所有数据和 css,但不知怎的,带有 jquery 按钮的脚本不起作用。
我的页面结构如下:

ob_start();
session_start();
if(isset($_SESSION['rol']))
{
    if(isset($_POST['getnewmail']))
    {
        //Do some query stuff here
        //Print the output through a foreach...
        echo '<div class="jbutton">';
        foreach($result as $key => $value)
        {
            foreach($value as $y => $mailid)
            {
                //echo the stuff
            }
        }
        echo '</div>';
    }
}

正如你可以猜到的,我在 foreach 之前的 div 上调用了 jquery 代码。其代码是:

$(function() {
    $("button, a", ".jbutton").button();
});

我的 AJAX 代码设置 $_POST['getnewmail']。

function loadinbox(serverpage, contentid)
{
    var xmlhttp = ajaxFunction();
    if (xmlhttp)
    {
        var params = "getnewmail=settrue";
        var url = "/location/php/" + serverpage;
        xmlhttp.open("POST", url, true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.setRequestHeader("Content-length", params.length);
        xmlhttp.setRequestHeader("Connection", "close");
        xmlhttp.onreadystatechange = function()
        {
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
               if(xmlhttp.responseText != "")
               {
                    document.getElementById(contentid).innerHTML=xmlhttp.responseText;
                    return;
               }
            }
        }
        xmlhttp.send(params);
    }
}

问题是,当我尝试在没有 AJAX 的情况下将邮件加载到收件箱时,我得到了我想要的内容。
但是,当我将代码移至 if 语句并使用 AJAX 调用它时,一切都失败了。

有人可以解释一下我做错了什么吗?为什么使用 AJAX 加载到 div 时 jquery ui 按钮不起作用?虽然它在通过普通 php 加载并且没有 AJAX 的情况下确实可以工作。

更新:
http://img35.imageshack.us/i/30fkdl30.png/

这里是一张图片来澄清问题所在。

I have a problem with the jquery ui button (I think).
I try to load an inbox via AJAX, I got all the data and css but somehow the script with the jquery button does not work.
I got my page structured as followed:

ob_start();
session_start();
if(isset($_SESSION['rol']))
{
    if(isset($_POST['getnewmail']))
    {
        //Do some query stuff here
        //Print the output through a foreach...
        echo '<div class="jbutton">';
        foreach($result as $key => $value)
        {
            foreach($value as $y => $mailid)
            {
                //echo the stuff
            }
        }
        echo '</div>';
    }
}

As you can guess I call the the jquery code upon the div before the foreach. The code for that is:

$(function() {
    $("button, a", ".jbutton").button();
});

My AJAX code sets the $_POST['getnewmail'].

function loadinbox(serverpage, contentid)
{
    var xmlhttp = ajaxFunction();
    if (xmlhttp)
    {
        var params = "getnewmail=settrue";
        var url = "/location/php/" + serverpage;
        xmlhttp.open("POST", url, true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.setRequestHeader("Content-length", params.length);
        xmlhttp.setRequestHeader("Connection", "close");
        xmlhttp.onreadystatechange = function()
        {
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
               if(xmlhttp.responseText != "")
               {
                    document.getElementById(contentid).innerHTML=xmlhttp.responseText;
                    return;
               }
            }
        }
        xmlhttp.send(params);
    }
}

The problem is when I try to load the mails into the inbox without AJAX I get what I want.
But when I move the code into an if statement and call it with AJAX it all fails.

Can somebody explain me what I am doing wrong? Why does jquery ui button not work when loaded into a div with AJAX? While it does work when loaded trough normal php and without AJAX.

UPDATE:
http://img35.imageshack.us/i/30fkdl30.png/

Here is an image to clarify what the problem is.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

柳若烟 2024-11-09 08:42:34

据我所知,在从服务器接收 div 内容之前调用了 javascript 代码。您应该在设置 divinnerHtml 属性后调用 .button()

From what I can tell, the javascript code is called before the div content is received from the server. You should call the .button() after you set the innerHtml propery of the div.

南笙 2024-11-09 08:42:34

谢谢,这对我也有用。我最后得到的结果是:

首先,我们发送 AJAX 响应,其次,我们重新初始化所有按钮。

xmlhttp.onreadystatechange=function()
{
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
        document.getElementById("users-contain").innerHTML=xmlhttp.responseText;

        //recall JQeuryUI buttons initialization.
        $("input:submit", ".demo" ).button();

     }

}

Thanks, that worked for me too. Here what I got at the end:

First, we send AJAX response, and second, we re-initialize all buttons.

xmlhttp.onreadystatechange=function()
{
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
        document.getElementById("users-contain").innerHTML=xmlhttp.responseText;

        //recall JQeuryUI buttons initialization.
        $("input:submit", ".demo" ).button();

     }

}

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文