-2

我正在尝试更新图像的 src,但在现场它只显示 <img class="imagedisplayor" style="float: none;" alt="" width="200" height="200" src=""/>

这是代码:

function ajaxFigure(){
var url = 'index.php?option=com_fabrik&format=raw&view=plugin&task=userAjax&method=imgclasse';
var product = Fabrik.blocks.form_8.formElements.orders___product.getValue();
var update = $('orders___image').firstChild;
new Request({
    url: url,
    data: {
        method: 'imgclasse',
        'product': product
    },
    onComplete: function (r) {
        update.src = 'http://www.youtraining.eu/preview' + r.replace('images/', 'images/');
        document.getElementById('orders___image').innerHTML = '<img class=\'imagedisplayor\' style=\'float:none;\' alt=

\'\'  width=\'200\' height=\'200\'  src="' + r + '">'
    }
}).send();


}

这里是我的 imgClasse()

function imgclasse() {
$db = JFactory::getDBO();
$IdClasse = JRequest::getVar("product", "");  

$query = "SELECT product_image from products WHERE id=$IdClasse LIMIT 1";
$db->setQuery($query);
$result = $db->loadResult();
echo $result; 


}

更新了所有内容。我要做的是为下拉列表中的每个元素显示一个图像,该列表是数据库中的一个条目。Js 和 PHP 是我可以使用的唯一方法,因为我在 CMS 中。

更改 var product= Fabrik.blocks.form_8.formElements.orders___product.getValue(); 现在它返回正确的值..但问题仍然存在

4

2 回答 2

0

According to your codes:

onComplete: function (r) {
        update.src = 'http://www.mysite.com/preview' + r.replace('images/', 'images/');
        document.getElementById('orders___image').innerHTML = '<img class=\'imagedisplayor\' style=\'float:none;\' alt=\'\'  width=\'200\' height=\'200\'  src=' + r + '>'
    }

I assume update.src is an object defined as:

var update= {src:"..."};

So, when you pass the value to the .src key of this object as:

update.src = 'http://www.mysite.com/preview' + r.replace('images/', 'images/');,

then the:

document.getElementById('orders___image').innerHTML = '<img class=\'imagedisplayor\' style=\'float:none;\' alt=\'\' width=\'200\' height=\'200\' src=' + r + '>',

Exchange r with update.src because the value of r is what you want update.src to contain including the replacement made by the .replace('images/', 'images/')

So it should be :

document.getElementById('orders___image').innerHTML = '<img class=\'imagedisplayor\' style=\'float:none;\' alt=\'\' width=\'200\' height=\'200\' src=' + update.src + '>'

You can confirm to see if your r variable really has something in it or if at all it's recognized by doing something like:

onComplete: function (r) {

  console.log(r)
//Before running any other code

Hope that helps!

于 2013-08-29T18:47:45.013 回答
0

简短的回答:

您没有使用新值更新图像源。您正在使用提供给函数的值对其进行更新。连接时还需要为 src 属性提供双引号。

document.getElementById('orders___image').innerHTML = '<img class=\'imagedisplayor\' style=\'float:none;\' alt=\'\'  width=\'200\' height=\'200\'  src="' + r + '">'

建议:

如果我是您并遇到此问题,我会为您的新图像路径创建一个 console.log,以根据您的实际图像路径验证生成的路径。r如果不知道提供给您的功能的价值,就很难说清楚。

另一个让我印象深刻的主要事情是您不需要完全替换图像元素。src如果您直接获得对图像元素的引用,然后将其属性更新为新位置,则会更简洁。同样,如果没有更多信息,很难为您提供更具体的信息。

于 2013-08-29T18:59:19.527 回答