在旋转的javascript横幅中添加链接

时间:2012-07-27 19:26:00

标签: javascript html css image href

我有一个旋转横幅,我需要添加指向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 Graves

1 个答案:

答案 0 :(得分: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的有效网址,以及您是否能够检索它(使用浏览器中的开发人员工具设置断点)并检查值,或使用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文件,它应该可以正常工作。