0

随着我所有的 ajax 加载：主页响应所有 jQuery.css 方向，但不响应任何加载的 ajax。举这个简单的例子来帮助说明我的观点。这是我不明白的概念。当我加载 (1) 时，(1.a) 图像响应 (2.b) 中的 jquery .css。当我单击 (1.b) 时，调用 (3) 加载 (4)。然而，（4.b）图像对（2.b）没有反应。

In (4a), I've tried:
<body onload='ImgCss()'/>
and/or <html><head><script type='text/javascript'>ImgCss()</script></head>
and/or <html><head><script type='text/javascript'> ($document).ect. </script></head>

我知道可以将 .live 用于事件。.css 是否相等？如果没有，我错过了什么？我对<style type="text/css"></style>不感兴趣，除非别无他法。

(1)<html><head>
<meta name="language" content="English">
<title>Clowns</title>
<script type="text/javascript" src="javascript/jsClowns.js"></script>
<script type="text/javascript" src="javascript/jquery-1.9.1.js"></script>
</head>
<body onload='ImgCss()'>
<table id='tblMainMenu' width="100%"> <!-- begin master table -->
    <tr><td>
    (1.a)<img class='ClownImage' src='clownDir/InitClown.gif' 
    (1.b)onClick='jsShowAllClowns("jaxClowns.php","jaxContainer")' />
    </td></tr>
<tr><td id="jaxContainer"></td>
</table>


    (2) jsClowns.js
    (2.a) function jsShowAllClowns(jaxURL, jaxContainer) {
    $.get( jaxURL,
    function(data) { $('#'+ jaxContainer).html(data); } 
    ); 
}
    (2.b) function ImgCSS(){$("img.ClownImage").css({'width':'205px','height':'205px'});}

(3) jaxClowns.php <?php
    include_once( "ClownList.php" ); ?>

(4) ClownList.php 
    (4.a)<html><head>
        <script type="text/javascript" src="app_modules/class/javascript/jsClowns.js"></script>
        <script type='text/javascript'src="jquery-1.9.1.js"></script>
        </head>
        <body>
        <table><tr>
          <?php
          $aList = GetClownList();
          for($i=0; $i<count($aList); $i++):
              $img=$aList[$i];  
              (4.b)echo "<td><img  class='ClownImage' src="$Img" ?><br /></td>";
          nextfor;   ?>
        </tr></table>
    </body></htm>
4

2 回答 2

0

我不确定，但可能是一个解决方案：

移动这段代码：

$("img.ClownImage").css({'width':'205px','height':'205px'});

至：

$.get( jaxURL, function(data) {
    $('#'+ jaxContainer).html(data);
    //here
});

它应该导致该样式将在get成功调用后分配给元素。

另一种方式。为什么不直接将 css 代码放入css 文件中？

img.ClownImage{
    width:205px;
    height:205px'
}
于 2013-06-15T18:05:16.360 回答
0

单击 1.b 后，容器中加载了 4 #jaxContainer

您需要再次调用 2.b 以便在最近通过调用 2.a 添加的元素上再次调用此函数（2.b）

所以将 2.a 更改为

function jsShowAllClowns(jaxURL, jaxContainer) {
    $.get( jaxURL,
    function(data) { $('#'+ jaxContainer).html(data); 
    ImgCSS()
    });
于 2013-06-15T18:06:04.733 回答