$（document）.ready（function（）{每次在Hyperlink的onclick事件上执行？

Question

在我的代码中，我使用 PHP 动态创建产品列表（请参阅图片），并且有用的labels and image paths存储在隐藏字段（{{ 1}}现在使用PHP） document.ready（）方法我使用第一个隐藏字段为remark和imagepath将第一个列表项的created dynamically及其备注设置为imagepath to img's src。

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

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

我的观点 在重新加载图像时，再次完成页面渲染，以便再次调用document.ready并将这些值再次设置为默认值。

注意：

我的页面不会在任何时候只重新加载图片和标签

图片中的listshown只是一个组，其他组也是动态创建的。

PHP中的服务器端代码

label remarks

警报仅用于测试值

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

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

Answer 1

您需要在点击下方停止重新加载。

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

Answer 2

猜测每次点击一个锚时，它都会执行一个新的页面加载。如果是这样，您可能需要将 preventDefault 添加到锚点 onClick方法。

假设您的代码看起来像这样，请在适当的位置添加 preventDefault（）：

$('a.availableProducts').click(function(ev){
   ev.preventDefault();
   //do image stuff or whatever
});

Answer 3

  

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

(document).ready()只应用于检测页面加载。如果您将HTML加载到DOM（例如通过ajax）并在其中包含(document).ready()，它也会触发。

(document).ready()是一种告诉jQuery的方法（在加载DOM并可编写脚本时执行此代码）。这样你就不需要将javascript放在HTML的末尾，以确保所有内容都已加载（尽管这仍然是一个很好的做法）。

Answer 4

感谢其他人的支持，感谢他们的回答，但答案都没有给我解决方案

一种不同的方法解决了我的问题

我的问题已经解决了这个

服务器端代码

<tr>
    <td width="220px" align="left" valign="top"><?php for($j=0;$j<count($productstr);$j++)
    {
        $valuerem = $productstr[$j]["remark"];
        $idrem  = "rem".$j.$grp;
        $valueimg =$productstr[$j]["imgpath"];
        $idimg = "img".$j.$grp;
        $valuepid = $productstr[$j]["pid"];
        $idpid ="pid".$j.$grp;
        $image = $productstr[0]["imgpath"];
        $remark = $productstr[0]["remark"];
        $pid = $productstr[0]["pid"];
        echo "<input type='hidden' value='$valuerem' id='$idrem' />" ;
        echo "<input type='hidden' value='$valueimg' id='$idimg' />" ;
        echo "<input type='hidden' value='$valuepid' id='$idpid' />" ;
    }
    ?> <script>
    txt = '#txt<?PHP echo $grp; ?>';
    img = '#img<?PHP echo $grp; ?>';
    alink = '#aimg<?PHP echo $grp; ?>';
    function Change<?PHP echo $grp; ?>(id){                                                                             
        idrv<?PHP echo $grp; ?> = 'rem'+id;
        idmv<?PHP echo $grp; ?> = 'img'+id;
        idpv<?PHP echo $grp; ?> = 'pid'+id;
        $('#txt<?PHP echo $grp; ?>').html(document.getElementById(idrv<?PHP echo $grp; ?>).value);
        $('#img<?PHP echo $grp; ?>').attr('src',document.getElementById(idmv<?PHP echo $grp; ?>).value);
        $('#aimg<?PHP echo $grp; ?>').attr('href',"view_large.php?mid="+document.getElementById(idpv<?PHP echo $grp; ?>).value);                                                                            
        return false;
        }   
    </script>
    <ul>
    <?php for($j=0;$j<count($productstr);$j++){
        $imgarray[ $productstr[$j]["imgpath"].'#'.$productstr[$j]["pid"]]  = $j+1;
        ?>
        <li><a id='<?PHP echo $j.$grp;?>'
            onclick="Change<?PHP echo $grp; ?>(this.id);"
            style="text-decoration: none; text-size: 1.3em; cursor: pointer;"
            title='Click to see'> <?php echo
            $productstr[$j]["pcode"]; ?> </a></li>
            <?php } $randomdata = array_rand($imgarray,1); $randompic = explode('#',$randomdata);
            ?>
    </ul>
    </td>
    <td align="left" valign="bottom" colspan="2"><label
        id="txt<?PHP
        echo $grp; ?>"><?PHP echo $remark; ?></label></td>
    <td width="110px" align="left" valign="bottom" style="width: 180px"><span
        class="color-4_inner p1" style="text-align: center;"> <a
        id="aimg<?PHP echo $grp; ?>"
        href="view_large.php?mid=<?PHP echo $pid; ?>"
        onclick="return hs.htmlExpand(this, { objectType: 'ajax'} )"> <img
        title='Click to view Full image!' id="img<?PHP echo $grp; ?>"
        src="<?PHP echo $image; ?>" border="0" width="102" height="110" /> </a>
    </span></td>
</tr>