单页链接在wordpress网站中不起作用

时间:2016-07-07 06:00:13

标签: javascript php jquery html wordpress

我的网站出现了一些奇怪的问题。我已经将一些链接添加到我的网站主页到另一个页面。像这样的东西

www.fsfsdafsdafdsafsadf/#pro1
www.fsfsdafsdafdsafsadf/#pro2
www.fsfsdafsdafdsafsadf/#pro3
www.fsfsdafsdafdsafsadf/#pro4

现在当我点击任何链接时,它会在我点击的任何链接上发送给div pro1 ..请检查该页面的html

<!--  section  1  image-->
<div id="pro2" name="pro2">
    <div class="inner-image-width">
        <div class="inner-left">
            <div class="titleinner">Unlimited possibilities   </div>
            Some text
        </div>
    <div class="inner-right">
        <img width="500" height="325" src="http://fsfsdafsdafdsafsadf/wp-content/uploads/2016/06/product1.jpg"  alt="product image1">
    </div>
</div>
</div>

<!--  section  1  no image-->
<div id="pro1" name="pro1">
<div class="inner-image-width">
<div ><div class="titleinner">Boost in revenue </div>

一些文字          

<!--  section  2  image-->
<div id="p5">
<div class="inner-image-width">
<div class="inner-left">
<div class="titleinner">Improved customer experience  </div>
Some text</div>
<div class="inner-right"><img width="500" height="325" src="http://fsfsdafsdafdsafsadf/wp-content/uploads/2016/07/product4.jpg"  alt="product image1"></div>
</div>
</div>

<!--  section  2  no image-->
<div class="inner-image-width">
<div>
<div class="titleinner">Confidence in security  </div>
Some text</div>
</div>

<!--  section  3 image-->
<div class="inner-image-width">
<div class="inner-left">
<img width="500" height="325" src="http://fsfsdafsdafdsafsadf/wp-content/uploads/2016/07/product3.jpg"  alt="product image1">
</div>
<div class="inner-right"><div class="titleinner">Happier staff   </div>
Some text</div>
</div>

<!--  section  3 no image-->
<div class="inner-image-width">
<div><div class="titleinner">Optimized marketing campaigns  </div>
Some text 
</div>
</div>

<!--  section 4  image-->
<div id="pro3" name="pro3" onlclick="window.location.hash = '#pro3'";>
<div class="inner-image-width">
<div class="inner-left">
<div class="titleinner">Secure payments  </div>
Some text</div>
<div class="inner-right"><img width="500" height="325" src="http://fsfsdafsdafdsafsadf/wp-content/uploads/2016/07/product6.jpg"  alt="product image1"></div>
</div>
</div>

<!--  section  4  no image-->
<div id="pro4" name="pro4">
<div class="inner-image-width">
<div><div class="titleinner">Fun entertainment   </div>
Some text</div>
</div>
</div>

<!--  section  5  image-->
<div id="pro6" name="pro6">
<div class="inner-image-width">
<div class="inner-left">
<img width="500" height="325" src="http://fsfsdafsdafdsafsadf/wp-content/uploads/2016/07/product5.jpg"  alt="product image1">
</div>
<div class="inner-right"><div class="titleinner">Reduced operating costs    </div>
Some text</div>
</div>
</div>

<!--  section  5  no image-->
<div class="inner-image-width">
<div>
<div class="titleinner">Immediate improvements </div>
Some text</div>

</div>

<!--  section 6  image-->
<div class="inner-image-width">
<div class="inner-left">
<div class="titleinner">Increased brand loyalty   </div>
Some text</div>
<div class="inner-right"><img width="500" height="325" src="http://fsfsdafsdafdsafsadf/wp-content/uploads/2016/07/product2.jpg"  alt="product image1"></div>
</div>


<!--  section  6 no image-->
<div class="inner-image-width">

<div><div class="titleinner">Minimal risk  </div>
Some text</div>
</div>

<div style="font-size:24px;"><a href="http://fsfsdafsdafdsafsadf/contact/" target="_blank">Contact us</a> Some text</div>

我尝试了stackoverflow的每个解决方案,但没有任何工作。有人可以帮帮我吗

2 个答案:

答案 0 :(得分:0)

你只需使用它:

<a href="#pro1">Pro 1</a>

答案 1 :(得分:0)

因为您在网址中使用了书签(#hushtag)。

查看HTML Links - Create a Bookmark

  

HTML书签用于允许读者跳转到特定部分   一个网页。

     

如果您的网站有长页面,则书签很实用。

     

要制作书签,您必须先创建书签,然后添加一个   链接到它。

     

单击链接后,页面将滚动到所在位置   书签。

在你的情况下,

www.fsfsdafsdafdsafsadf/#pro1 -> click this link will jump to div #pro1

www.fsfsdafsdafdsafsadf/#pro2 -> click this link will jump to div #pro2

www.fsfsdafsdafdsafsadf/#pro3 -> click this link will jump to div #pro3

www.fsfsdafsdafdsafsadf/#pro4 -> click this link will jump to div #pro4

基本上,您的网址书签(#hushtag)可以正常使用。

如果你想链接到另一个页面,请避免使用hashtag,可能是这样的:

www.fsfsdafsdafdsafsadf / pro1.php - &gt;点击这将链接到'pro1.php'

像这样:

<a href="http://www.fsfsdafsdafdsafsadf/pro1.php">link text</a>
<a href="pro1.php">link text</a>