我想在用户填写输入字段后使用JavaScript显示图像。使用输入type =“ text”时,它已经显示了URL,但是当我尝试将其更改为img标签时,它将返回[object Object]。这可能吗?
input.php
<div class='col1;'> <img style='width:20%' src="" alt="" id="img" ></div>
<script type="text/javascript">
$(document).ready(function() {
function myrequest2(e) {
var mn = $('.auto2').val();
var pn = $('.auto').val();
$.ajax({
method: "GET",
url: "autofill2.php",
dataType: 'json',
data: {
inputmn: mn,
inputpn: pn
},
success: function( responseObject ) {
var x = $('#img').val( responseObject.image);
document.getElementById("img").src = x;
document.getElementById("img").alt = x;
},
failure: function() {
alert('fail');
}
});
}
$('#mn').change(function(e) {
e.preventDefault();
myrequest2();
});
});
</script>
autofill2.php
<?php
$conn = mysqli_connect($host, $username, $password, $db);
$inputmn = $_GET['inputmn'];
$inputpn = $_GET['inputpn'];
$return = mysqli_query($conn, "SELECT image FROM parts WHERE ModelNum = '$inputmn' and PartNum = '$inputpn' LIMIT 1");
$rows = mysqli_fetch_array($return);
$formattedData = json_encode($rows);
print $formattedData;
?>
另外,我知道我需要准备好的陈述。只是先让它起作用
您responseObject
为用例错误地调用了该参数。的x
变量是jQuery
选择器。该选择器不包含图像数据。由于您将图像src
设置为选择器(这是无效的),因此它会退回到alt
文本上。由于您也将alt
文本设置为jQuery
选择器,toString()
因此运行了该函数,因此您看到了[Object object]
,因为jQuery
选择器没有重写toString()
。为了解决这个问题:更改x
到responseObject.image
和变化alt
的一个形象的描述。
success: function( responseObject ) {
var x = responseObject.image // assuming .image is img data
document.getElementById("img").src = x;
document.getElementById("img").alt = "Nice image";
},
提醒您,您正在与进行混搭jQuery
。如果要继续使用jQuery
,可以更改document.getElementById("img") = x
为$("#img").attr("src", x);