【问题标题】:Add jQuery variables in src of an image not working在图像的 src 中添加 jQuery 变量不起作用
【发布时间】:2016-06-15 02:32:26
【问题描述】:

我有一个网站,基于语言en, sq or el, 我想更改图像源。所以我有一个名为 screenshots 的文件夹,然后是三个文件夹:en, sq and el

例如,名为“slide-phone.png”的图片的 URL 是:

static/img/screenshots/en/slide-phone.png
static/img/screenshots/sq/slide-phone.png
static/img/screenshots/el/slide-phone.png

我想获取 HTML 标签的属性 lang,然后将其添加到图像的源中,但由于某些原因,它不起作用。

我的代码如下所示:

<html lang="{{ _('en') }}">
<script type="text/javascript">
 $(document).ready(function(e){
       var language = $('html').attr('lang');
});
</script>
...
 <img  id="slide-phone-1-img" src="{{ url_for('static', filename='img/screenshots/' + language+'slide-phone.png') }}" >

我正在使用 python 和 jinja。任何帮助:)

编辑:

我也尝试过这样,但问题是我想使用 jinja,为此我需要更改此代码:

<html lang="{{ _('en') }}">
    <script type="text/javascript">
     $(document).ready(function(e){
           var language = $('html').attr('lang')
           img_url = 'img/screenshots/'+ language+'/slide-phone.png';
           $('#slide-phone-img').attr('src',img_url);
    });
    </script>

【问题讨论】:

  • 它应该如何工作?你如何以及在哪里调用你的变量语言?
  • @MKAD 在图像 div 的 src 中?
  • 你不能从
  • 有什么办法吗?
  • 如果它不起作用请告诉我

标签: javascript jquery html image tags


【解决方案1】:

类似的东西

$(document).ready(function(e){
       var language = $('html').attr('lang');
       var new_url = $('#slide-phone-1-img').attr("src").replace("language", language);
       console.log(new_url);
       $('#slide-phone-1-img').remove();
       $('#imges').prepend('<img id="slide-phone-1-img" src="'+new_url+'" />');

$('#show').html( $('#slide-phone-1-img').attr("src").replace("language", language));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html lang="{{ _('en') }}">
   <body>
    <div id="imges">
     <img  id="slide-phone-1-img" src="{{ url_for('static', filename='img/screenshots/language slide-phone.png') }}" > 
    </div>   
    <div id="show">
      <p></p>
    </div>
   </body>
</html>

【讨论】:

  • 我做了一个console.log,它显示了这样的好链接:/static/img/screenshots/en/slide-phone.png,但在scr中没有被替换。这可能是因为页面加载并在它之后执行 jquery 代码?
  • 你的意思是你的html img标签中的src没有被替换?
  • 如果我理解正确,你想在 jQuery 之后更改你的 example.html 中的代码吗?从 ..... 到 对吧?
  • 没错,你的代码就像我之前所说的那样工作如果我做一个 console.log($('#slide-phone-1-img').attr("src").replace(" language", language)) 它给出了正确的 url,但是 src 中的 url 没有改变。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-03-15
  • 1970-01-01
  • 2017-01-09
  • 1970-01-01
  • 2013-02-08
  • 1970-01-01
相关资源
最近更新 更多