Question

JSfiddle Demo：http://jsfiddle.net/ZfT64/1/

每当用户在image url框中输入input时，我想立即将其附加到图片部分的img_logo ID中。

不确定，与event合作的内容。

这是我的代码： -

<input type="text" name="org_img" id="org_img" class="input-xlarge" placeholder="http://www.example.com/logo.png" value="<?php echo isset($row['org_img']) ? htmlentities($row['org_img']) :  'http://www.example.com/img/logo.png'; ?>" />

<span class="pull-right" id="img_logo"><img width="300px" height="80px" src="<?php echo isset($row['org_img']) ? htmlentities($row['org_img']) :  'http://www.example.com/img/logo.png'; ?>" /></span>

及以下是Javascript函数的有效性和追加img_logo ID。

function IsValidImageUrl(url, callback) {
    jQuery("<img>", {
        src: url,
        error: function() { callback(1); },
        load: function() { callback(0); }
    });
}



jQuery('#org_img').change(function() {
    var img_name = jQuery('#org_img').val();
    IsValidImageUrl(img_name, function (val){
        if (val == 0)
            jQuery('#img_logo').html('<img src="'+img_name+'" width="300px" height="80px" />');
        if (val == 1)
            alert('Please Provide Valid URL Image');
            jQuery('#img_logo').html('<img src="http://www.example.com/img/logo.png" width="300px" height="80px" />');
    });
});

但这不是工作，需要帮助。

由于

Answer 1

看看这个

http://jsfiddle.net/ZfT64/4/

function IsValidImageUrl(url, callback) {
    jQuery("<img>", {
        src: url,
        error: function() { callback(1,null); },
        load: function() { callback(0,url); }
    });
}

$('#org_img').change(function() {
    var img_name = $(this).val();
    IsValidImageUrl(img_name, function (val,url){
        if (val == 0) {
            $('#image_logo').attr('src',url);
        }
        if (val == 1) {
            alert('Please Provide Valid URL Image');
            $('#image_logo').attr('src',"https://www.google.com/images/srpr/logo11w.png");
        }
    });
});

输入更改后更改图像

1 个答案: