Question

我正在尝试获取点击商家名称后出现在灯箱中的链接。在一个独立的页面上，它是可能的，但只要我通过ajax发送相同的代码，它就不再调用灯箱了。帮助

这是原始文件，应该代表第三方发布商网站，整合我们的代码：

<html>
<head>
    <script type="text/javascript" src="lib/js/jquery-latest.js"></script>
    <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
    <script src="lib/js/jquery.ppo.js" type="text/javascript" charset="utf-8"></script>
    <script src="lib/js/sp.js" type="text/javascript" charset="utf-8"></script>         
</head>
<body>
    This is the publisher's website. <br>
    <div id="bizname1" onclick="showComp(this.innerHTML)" id="bizname" class="bizname">click here - this event should be substituted for an 'on load'.</div><br><br>

lots of data about the company here

<br />
<div id="txtHint"><b>Company info will be listed here.</b></div>


</body>
</html>

这是ajax脚本，showcomp.js：

function showComp(str)
{
if (str=="")
  {
    document.getElementById("txtHint").innerHTML="";
    return;
  }
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getbutton.php?q="+str,true);
xmlhttp.send();
}

这是ajax函数调用的getbutton.php文件：

error_reporting(E_ALL);
ini_set('display_errors', 1);
session_start();

include('config.php');  
init_connection();

$sql=select content from db;// this part works fine, so actual sql query not inserted here.

$result = mysql_query($sql);

while ($row = mysql_fetch_object($result)) {

    $companyname = $row->result1;
    $contenturl = $row->result2;
    //echo $companyname;
    //echo $contenturl;

?>  

<HTML>
<HEAD>

</HEAD>
<BODY>
    <a href="http://www.youtube.com/embed/DudfBIxw6do?iframe=true&width=640&height=390" rel="prettyPhoto" title="my caption"> Video in iframe
    <img src="images/thumb-1.jpg" width="100" height="40" alt="Video in iframe" />
    </a>
<a href="demo/vidrefer.php?iframe=true&width=500&height=410" rel="prettyPhoto" title="my caption"> Vidrefer in iframe
    <img src="images/thumb-1.jpg" width="100" height="40" alt="Vidrefer in iframe" />
</a>
<br />


</BODY>
</HTML> 

<?php
}

//echo out button here. give the button what it needs to launch the light box. 
echo "
<br>
<div id='button'>
this is a button
</div>
";
//mysql_close($con);
?>
<script id="ppready" type="text/javascript" charset="utf-8">
    $(document).ready(function(){
    $("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>

如果你能看出它为什么不起作用，请帮忙！谢谢。

Answer 1

我修好了！问题是由于javascript在我通过ajax加载新元素之前已经采取行动的事实。我所要做的就是在ajax调用之前加载我的元素并且嘿presto！

另一种解决方案是在jquery中使用live（）或livequery（）。他们会在加载到DOM之前和之后保持jquery对元素的作用。 Simples。

Answer 2

当它刚从服务器端回送时，JS不会在客户端运行。尝试移动您的代码块

$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto();
<-- inside--> 
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}

看起来像：

if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
$("a[rel^='prettyPhoto']").prettyPhoto();
}

通过ajax返回javascript但它不起作用

2 个答案: