Question

对不起，我是php＆amp;的新手jquery的

如何使用jquery

根据下面的下拉菜单代码更改图像

 echo "<div class='form-group'>";
echo "    <label for='image'>  Select Image File :</label>
<select name='image' class='form-control'>
 <option value=''>Select Image </option>";

 foreach(glob(dirname(__FILE__) . '/images/*.{jpg,png,gif}', GLOB_BRACE) as $image){
       $image = basename($image);
       echo "<option value='" . $image . "'>".$image."</option>";
    }



echo "</select></div>";


 <script>
 $(document).ready(function() {
$("#image :selected").text(); // The text content of the selected option
$("#image").val(); // The value of the selected option

});
</script>

echo "<img src='images/$image'<br /><br />";

Answer 1

 echo "<div class='form-group'>";
 echo "<label for='image'>  Select Image File :</label>
 <select name='image' id='selectsrc' class='form-control'>
   <option value=''>Select Image </option>";
   foreach(glob(dirname(__FILE__) . '/images/*.{jpg,png,gif}', GLOB_BRACE) as $image){
       $image = basename($image);
       echo "<option value='" . $image . "'>".$image."</option>";
   }

 echo "</select></div>";
 echo '<img src="images/example.jpg" id="changesrc">';

 <script>
   $(document).ready(function() {
     $('#selectsrc').change(function(){
         $("#changesrc").attr('src',$(this).val());
     });
   });
 </script>

Answer 2

 echo "<div class='form-group'>";
echo "    <label for='image'>  Select Image File :</label>
<select name='image' class='form-control' id=
'image'>
 <option value=''>Select Image </option>";

 foreach(glob(dirname(__FILE__) . '/images/*.{jpg,png,gif}', GLOB_BRACE) as $key => $image){
       $image = basename($image);
       echo "<option data-img-src='".$image."' value='".$key. "'>".$image."</option>";
 }



echo "</select></div>";

之后，您的更改可以是，例如：

$('#image').change(function () {
    $('img').attr("src", $( this ).find( "option:selected" ).data( "img-src" ));
});

根据下拉列表更改图像

2 个答案: