$(document).ready(function(){每次在超链接的onclick事件上执行？

Question

在我的代码中,我正在使用PHP动态创建产品列表(参见图片),并且现在在document.ready()方法中将currosponding labels and image paths存储到隐藏字段(created dynamically使用PHP)中我将第一个列表项及其备注设置为使用第一个隐藏备注和图像路径的字段.imagepath to img's srclabel remarks

在listitem上单击我要更改它我的函数将这些值设置为img并正确标记(使用警报检查)但是当函数结束时它将图像src和rene innertext设置为在document.ready()方法上设置的默认值

现在我的问题是我可以阻止下次在javascript函数调用时执行document.ready()

我的视图: 重新加载图像,以便再次完成页面渲染,以便再次调用document.ready并将这些值再次设置为默认值.

注意 :

只有在更改图像和标签时,我的页面才会重新加载

图像中的列表只是一个组,其他组也是动态创建的.

PHP中的服务器端代码

<?php 
for($j=0;$j<count($productstr);$j++) { 
$valuerem = $productstr[$j]["pcode"];
$idrem  = "rem".$j.$grp;
$valueimg =$productstr[$j]["imgpath"];
$idimg = "img".$j.$grp;
echo "<input type='hidden' value='$valuerem' id='$idrem' />" ;
echo "<input type='hidden' value='$valueimg' id='$idimg' />" ;
}?>
<script>   
   $(document).ready(function() {
    idrv < ? PHP echo $grp; ? > = 'rem0<?PHP echo $grp; ?>';
    idmv < ? PHP echo $grp; ? > = 'img0<?PHP echo $grp; ?>';
    $('#txt<?PHP echo $grp; ?>').text(document.getElementById(idrv < ? PHP echo $grp; ? ).value);
    alert($('#txt<?PHP echo $grp; ?>').text());
    $('#img<?PHP echo $grp; ?>').attr('src', document.getElementById(idmv < ? PHP echo $grp; ? > ).value);
    alert($('#img<?PHP echo $grp; ?>').attr('src'));
  });

  function Change(id) {
    idrv < ? PHP echo $grp; ? > = 'rem' + id;
    idmv < ? PHP echo $grp; ? > = 'img' + id;
    $('#txt<?PHP echo $grp; ?>').text(document.getElementById(idrv < ? PHP echo $grp; ? > ).value);
    alert($('#txt<?PHP echo $grp; ?>').text());
    $('#img<?PHP echo $grp; ?>').attr('src', document.getElementById(idmv < ? PHP echo $grp; ? > ).value);
    alert($('#img<?PHP echo $grp; ?>').attr('src'));
    return true;
  }?
</script>

警报仅用于测试值

在客户端浏览器生成的代码

 <tr>
    <td width="220px" valign="top" align="left">
    <input id="YN" type="hidden" value="true">
    <input id="rem00" type="hidden" value="SPL FUNNEL 1">
    <input id="img00" type="hidden" value="adminpanel/product_images/4f8e530154d74155.jpg">
    <input id="rem10" type="hidden" value="SPL FUNNEL 2">
    <input id="img10" type="hidden" value="adminpanel/product_images/4f8e53daf13e6156.jpg">
    <input id="rem20" type="hidden" value="SPL FUNNEL 3">
    <input id="img20" type="hidden" value="adminpanel/product_images/4f8e543100eaf157.jpg">
    <input id="rem30" type="hidden" value="SPL FUNNEL 4">
    <input id="img30" type="hidden" value="adminpanel/product_images/4f8e545a829e1158.jpg">
    <script>
    $(document).ready(function() {
        idrv0 = 'rem00';
        idmv0 = 'img00';
        $('#txt0').text(document.getElementById(idrv0).value);
        alert($('#txt0').text());
        $('#img0').attr('src', document.getElementById(idmv0).value);
        alert($('#img0').attr('src'));
    });

    function Change(id) {
        $('#YN').val('false');
        idrv0 = 'rem' + id;
        idmv0 = 'img' + id;
        $('#txt0').text(document.getElementById(idrv0).value);
        alert($('#txt0').text());
        $('#img0').attr('src', document.getElementById(idmv0).value);
        alert($('#img0').attr('src'));
        return true;
    }?
    </script>
    <ul>
    <li>
    <a id="00" style="text-decoration: none; text-size: 1.1em; color: " 
onclick=" Change(this.id); alert($('#txt0').text()); alert($('#img0').attr('src'));">
SPL FUNNEL 1</a>
    </li>
    <li>
    <li>
    <li>
    </ul>
    </td>
    <td valign="bottom" align="left" colspan="2">
    <td width="110px" valign="bottom" align="left" style="width: 180px">
    </tr>

Answer 1

您需要停止点击重新加载,如下所示.

$('a.availableProducts').click(function(e){
   e.preventDefault();
   // your code
});