0

このコードは検索で取得します..

    <html>
<head>
<title>Get url for address bar</title>
<script>
    function display(folder,img_name) 
    {
        var src = "http://localhost/UPLOADER/images/"+folder+"/"+img_name;
        show_image("http://localhost/UPLOADER/images/"+folder+"/"+img_name, 276,110, "Img");
    }


    function show_image(src, width, height, alt) 
    {
        var img = document.createElement("img");
        img.src = src;
        img.width = width;
        img.height = height;
        img.alt = alt;
        document.body.appendChild(img);
    }
</script>
</head>
<body>
<input type="text" name="image" value="" style="margin-top: 4px;" placeholder="Image_name" />
<button onclick="display('a','access')">DISPLAY IMAGE</button>

</body>
</html>

jqueryのサイトから取得したこのコードはうまく機能しますが、コードに間違いがあり、表示されるエラーを簡単に把握できないと思います。未定義の画像と機能の表示。

画像の動的選択のためにこれを追加したい

<?php
     $img_name=$_POST['image'];
     $folder = substr($img_name, 0, 1);
?>
<button onclick="display('$folder','$img_name')">DISPLAY IMAGE</button>

拡張子には .htaccess を使用しますOptions +MultiViews ありがとう

4

1 に答える 1

0

OK、この問題には多くの解決策があります。phpページへのajax呼び出しに変更して、画像/画像を取得することは1つです。非常に簡単な解決策はこれです...

<?php
$image = (isset($_REQUEST['image'])) ? $_REQUEST['image'] : false;
$folder = ($image) ? substr($image, 0, 1) : false;
?>
<html>
<head>
<title>Get url for address bar</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
    var image = '<?php echo ($image) ? $image : "false"; ?>';
    var folder = '<?php echo ($folder) ? $folder : "false"; ?>';
    var extension = '.jpg';
    function DISPLAY(folder,img_name, imgExt) {
        var finalExt = (typeof imgExt != 'undefined') ? imgExt : extension;
        if(img_name != 'false' && folder != 'false') {
            show_image("http://localhost/UPLOADER/images/"+folder+"/"+img_name+finalExt, 276,110, "Img");
        } else {
            console.log("looks like something was undefined, here's the values:");
            console.log(folder);
            console.log(img_name);
    } 
    }


    function show_image(src, width, height, alt) 
    {
        var img = document.createElement("img");
        img.src = src;
        img.width = width;
        img.height = height;
        img.alt = alt;
        document.body.appendChild(img);
    }
//if using jquery
$(document).ready(function() {
    //you could also add logic here to see if values are not 'false' and run function
    DISPLAY(folder, image);
});
</script>
</head>
<body>
<form action="" method="POST">
<input type="text" name="image" value="" style="margin-top: 4px;" placeholder="Image_name" />
<button>DISPLAY IMAGE</button>
</form>
</body>
</html>
于 2013-07-10T08:58:28.367 に答える