使用“＃”的替代方案在href属性中 [英] Alternatives for using "#" in href attribute

问题描述

可能存在重复：

Href for Javascript链接：＃或者javascript：void（0）rdquo ;?

< a> 标记用于创建超链接，但在jQuery和Ajax这个时代，我们使用它来将HTML加载到< div> s中页面作为< a> 标记。

也就是说，我们设置 href atribute作为 href =＃，使用或更确切地滥用＃字符作为占位符以及一些不良的副作用，如URL追加＃字符。

如果您离开 href 属性空白 href =，该链接似乎无效。

无论如何，当浏览器的状态栏显示一些文本或虚拟函数时，用户可以在链接上悬停并使链接按照程序员的意图进行操作时使用更清晰的方式执行此操作？

这是我的代码。

 < ul id =sidebarmenu1 & GT; 
 //转换成菜单的列表... 
< li> < a href =＃id =loadHotel> HOTEL< / a> < /锂> 
< li> < a href =＃id =loadCountry> COUNTRY< / a> < /锂> 
< li> < a href =＃id =loadCity> CITY< / a> < /锂> 
< / ul> 
 
 // jQuery使用Ajax将内容加载到另一个div 
 var loadUrl =createHotel.php; 
 $（＃loadHotel）。click（function（）{
 $（＃mainContent）。html（ajax_load）.load（loadUrl）; 
}）; 
 
 // ajax函数载入酒店--->房间页面
 
 var url_loadRooms =viewRooms.php; 
 $（＃createRooms）。click（function（）{
 $（＃mainContent）。html（ajax_load）.load（url_loadRooms）; 
}）; 
  

我还可以用什么来代替＃使我的代码整洁。？

解决方案

最好的解决方案是根本不使用虚拟占位符。使用一个有意义的URL，如果实际遵循该链接，则会显示您从AJAX请求中获得的信息。

我经常使用我的网络应用程序执行此操作，并使用Javascript来增强工作网站。例如，HTML：

 < a href =/ users / index =popup>查看用户< ; / A> 
  

Javascript（jQuery）：

<$ p点击（功能（）{
loadPopup（{//无论您最喜欢的灯箱是什么，等等.. $ b（$ a code> $''a [rel * =popup]'）。 $ b url：this.href
}）;
return false;
}）;


这个好处很多。您的网站可以通过关闭javascript来浏览读者，网络抓取工具和用户，甚至那些打开javascript的用户也可以在状态栏中获得一个有意义的URL，以便他们知道他们要去哪里。

Possible Duplicate:
Href for Javascript links: “#” or “javascript:void(0)”?

The <a> tag is used to create hyperlinks but in this age of jQuery and Ajax we are using it to load HTML into <div>s in the same page as the <a> tags.

That said, we set the href atribute as href="#", using or rather abusing the # character as a placeholder along with some undesirable side effects like the URL getting appended with the # character.

And if you leave the href attribute blank href = "", the link does not seem to work.

Is there anyway to do this in a cleaner way like showing some text or dummy function in the status bar of the browser when the user hovers over the link and yet make the link do what the programmer intended?

Here's my code.

<ul id="sidebarmenu1">
   // List that is converted into a menu... 
   <li> <a href="#" id="loadHotel" > HOTEL </a> </li>
   <li> <a href="#" id="loadCountry"> COUNTRY </a> </li>
   <li> <a href="#" id="loadCity"> CITY </a> </li>
</ul>

// The jQuery to load content into another div with Ajax
var loadUrl = "createHotel.php";
$("#loadHotel").click(function() {
    $("#mainContent").html(ajax_load).load(loadUrl);
}); 

// ajax function to load hotel ---> rooms page 

var url_loadRooms = "viewRooms.php";
$("#createRooms").click(function() {
    $("#mainContent").html(ajax_load).load(url_loadRooms);
});

What else can I use instead of "#" to make my code neat..?

解决方案

The best solution is to not use some dummy placeholder at all. Use a meaningful URL which, if the link were actually followed, would show you the information you'd get from the AJAX request.

I do this regularly with my web apps, using Javascript to enhance a working site. For example, the HTML:

<a href="/users/index" rel="popup">View users</a>

The Javascript (jQuery):

$('a[rel*="popup"]').click(function() {
    loadPopup({    // whatever your favourite lightbox is, etc..
        url: this.href
    });
    return false;
});

The benefits of this are numerous. Your site is accessible to screen readers, web crawlers and users with javascript off, and even those with javascript turned on will get a meaningful URL in their status bar, so they'll know where they're going.

这篇关于使用“＃”的替代方案在href属性中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！