【问题标题】:Adding link in rotating javascript banner在旋转 javascript 横幅中添加链接
【发布时间】:2012-07-26 12:32:04
【问题描述】:

我有一个旋转横幅,需要添加指向example 的链接。下面是部分js代码。我的问题是让 href 在 index.php 页面中工作。

function change_banner(){

data=xmldata[changenum];                    //get current banner XML object 

img=$(data).attr("src");                    //retrieve variables
href=$(data).attr("href");
target=$(data).attr("target");

$(".banner_img_href").attr("href",href);        //change variables on HTML
$(".banner_img_href").attr("target",target);
$("#banner_image").attr("src",img);

这是html:

<div class="banner">
    <div class="banner_text">
        <img src="images/banner_text.png">
    </div>
    <div class="banner_img">
         <img   border='0' src="images/banner_gas.png" id='banner_image' alt='Banner Image' />
    </div>
</div>     

我尝试了基本链接,但没有骰子。不知道我哪里出了问题。

谢谢,

B 坟墓

【问题讨论】:

  • 你想要整个横幅都可以点击吗?
  • .banner_img_href 在哪里,我在页面的源代码中看不到它。你的 $(".banner_img_href") 返回一个空的 jQuery 对象
  • 您说您尝试了基本链接。这是否意味着您尝试将横幅或部分横幅包装在锚标签中?
  • 我只需要可点击的机器图像。 javascript正在调用一个xml文件,该文件正在调用我没有创建的图像,所以我不确定它的确切想法。是的,我尝试包装图像标签,并尝试包含图像的链接并将其放在图像之后,但都没有结果。

标签: javascript html css image href


【解决方案1】:

我知道您说过您尝试了基本链接,但以下 html 应该可以工作:

<div class="banner">
    <div class="banner_text">
        <a class="banner_img_href" href="http://someurl.com">
            <img src="images/banner_text.png">
        </a>
    </div>
    <div class="banner_img">
         <a class="banner_img_href" href="http://someurl.com">
             <img border='0' src="images/banner_gas.png" id='banner_image' alt='Banner Image' />
         </a>
    </div>
</div>

JavaScript:

function change_banner(){

    data=xmldata[changenum];                    //get current banner XML object 

    img=$(data).attr("src");                    //retrieve variables
    href=$(data).attr("href");
    target=$(data).attr("target");

    $(".banner_img_href").attr("href",href);        //change variables on HTML
    $(".banner_img_href").attr("target",target);
    $("#banner_image").attr("src",img);
}

在您的代码中,您没有任何具有 banner_img_href 类的元素,因此实际上并未在任何元素上设置 href 属性。

如果这不起作用,我将验证您的数据是否确实包含有效的 href url,并且您能够检索它(使用浏览器中的开发人员工具设置断点并检查值, 或使用console.log(href) 将值输出到 JavaScript 控制台。

编辑:我刚刚检查了您获取数据的方式和数据格式。您的 XML 文件可能应该采用不同的格式,如下所示:

<gallery fade="500" ontime="5000">
    <picture src="images/banner_gas.png" href="desiccant-dryers-air-dryers.php" />
    <picture src="images/banner_liquid.png" href="backwashing-sand-filters.php" />
    <picture src="images/banner_mis.png" href="air-cooled-chillers-explosion-preventers.php" />
</gallery>

问题在于您获取数据的方式以及数据的格式。如果您按照上述方式格式化 xml 文件,它应该可以正常工作。

【讨论】:

  • 这个团队的出色表现还没有让我失望。非常感谢您的聪明才智和帮助。
猜你喜欢
  • 2016-04-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-01-04
  • 2023-03-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多