Question

使用我的所有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相等？如果没有，我错过了什么？我对＆lt; style type =“text / css”＆gt;＆lt; / style＆gt; 不感兴趣，除非没有别的办法。

(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>

Answer 1

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

移动此代码：

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

为：

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

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

另一种方式。为什么不把css代码放入 css文件？

img.ClownImage{
    width:205px;
    height:205px'
}

Answer 2

单击1.b后，将4加载到容器#jaxContainer

中

你需要再次调用2.b，以便通过调用2.a

在最近添加的元素上再次调用此函数（2.b）

所以将2.a更改为

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

jQuery .css不响应加载的ajax

2 个答案: