Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/442.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何使JavaScript动态化?_Javascript_Php_Loops - Fatal编程技术网

如何使JavaScript动态化?

如何使JavaScript动态化?,javascript,php,loops,Javascript,Php,Loops,我想移动文档。getElementById(“b”)已在循环中签入。是否可能?我怎样才能做到 <img class="img-responsive pic" id="picture" src="images/step1.png"> <?php //get rows query $query = $db->query("SELECT * FROM `template_design` WHERE

我想移动
文档。getElementById(“b”)
已在循环中签入。是否可能?我怎样才能做到

<img class="img-responsive pic" id="picture" src="images/step1.png">
 <?php
                    //get rows query
                    $query = $db->query("SELECT * FROM `template_design` WHERE `panel` = 'front'");    

                    if($query->num_rows > 0){ 
                        while($row = $query->fetch_assoc()){
                         $im_id = $row['id'];
                         $images = "images/" .$row['image']. "";                           
                    ?>
                 <div class="col-md-4 col-sm-4 wel-grid wow fadeInDown">
                    <div class="wel11">
                        <input type="radio" id="<?php echo 'radio_'.$im_id; ?>" name="front" onClick="changeSrc(<?php echo  $im_id; ?>)">
                       <label  for="<?php echo 'radio_'.$im_id; ?>"  style="font-size:12px; cursor: pointer;">
                       <img  id="<?php echo 'picture_'.$im_id; ?>" style="border: 1px solid #ccc;" class="img-responsive" src="<?php echo $images; ?>"></label>
                    </div>
                 </div>
             <?php } } ?>

     <script type="text/javascript">
     function changeSrc(id) {
        if (document.getElementById("radio_"+id).checked) {
     document.getElementById("picture_"+id).src = "images/Ppicture3.png";
        }
}
    </script>


您可以使用id传递参数,例如:

 <input type="radio" id="<?php echo 'radio_'.$im_id; ?>" name="<?php echo $fname; ?>" onClick="changeSrc(<?php echo  $im_id; ?>)">

请试试这个。将radio id作为attr id传递&按各自的id保存每个图像,后跟各自的id.png。还可以从html代码中删除onclick函数

<script type="text/javascript">
  $("input:radio[name=front]").click(function() {
    var id= $(this).attr('id');
    document.getElementById("picture").src = "panel/front/" + id + ".png";
    });
</script>

$(“输入:radio[name=front]”。单击(函数(){
var id=$(this.attr('id');
document.getElementById(“picture”).src=“panel/front/”+id+”.png”;
});

谢谢您的回答,但“我得到”未捕获的语法错误:输入意外结束“错误您能用您的问题更新修改后的代码吗,这样我就可以确定您犯了错误。代码中的id“picture”在哪里{document.getElementById(“picture”).src=“images/Ppicture3.png};添加像id=”这样的图像id,然后进入类似javascript的文档。getElementById(“picture_“+id)希望这就是你代码中的问题。你在上面的代码中遗漏了一个“}”,只是遗漏了这里。现在解决了,或者你仍然有问题?我仍然面临着如何使它随着id的增加而变得动态的问题
<script type="text/javascript">
  $("input:radio[name=front]").click(function() {
    var id= $(this).attr('id');
    document.getElementById("picture").src = "panel/front/" + id + ".png";
    });
</script>