我的鏈接無法正常工作使用jQuery

Question

我有這樣

<li><a class='myclass' href="<?php echo base_url();?>index.php/controller">Search</a></li> 

一個鏈接，我的jQuery是

$("a.myclass").click(function(){ 
var link = $(this); 
var url = link.attr("href"); 
$(".content").load(url); 

return false; 

}); 

實際上它鏈接正確的問題是我在我的菜單列表長得難看不是它看起來應該是雖然其他李看起來確定。當我改變爲

<li><a class='.myclass.' href="<?php echo base_url();?>index.php/controller">Search</a></li> 

它看起來不錯，但它沒有鏈接到任何東西。

這裏有什麼問題？

這裏是我的CSS

.webwidget_vertical_menu { 
    float: left; 
    width: 20%; 
    background-color: #fff; 
    padding-bottom: 10px; 

    } 
.webwidget_vertical_menu ul{ 
    padding: 0.5px; 
    margin: 0px; 
    font-family: Arial, Helvetica, sans-serif; 


} 
.webwidget_vertical_menu li{ 


} 
.webwidget_vertical_menu ul li{ 
    list-style: none; 
    position: relative; 

} 
.webwidget_vertical_menu ul li a{ 
    padding-left: 15px; 
    text-decoration: none; 

} 
.webwidget_vertical_menu ul li ul{ 
    display: none; 
    position: absolute; 
    background-color: #fff; 
    z-index: 999999; 
} 
.webwidget_vertical_menu ul li ul li{ 
    position: relative; 
    margin: 0px; 
    border:none; 
} 
.webwidget_vertical_menu ul li ul li ul{ 

} 
.webwidget_vertical_menu_down_drop{ 
    background-position: right center; 
    background-repeat:no-repeat !important; 
} 
.webwidget_vertical_menu ul li li{ 
    font-weight: normal; 
} 


body { 
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif; 
    background-color: #42413C; 
    margin: 0; 
    padding: 0; 
    color: #000; 

} 

ul, ol, dl { 
    padding: 0; 
    margin: 0; 
} 
h1, h2, h3, h4, h5, h6, p { 
    margin-top: 0; 
    padding-right: 15px; 
    padding-left: 15px; 
} 
a img { 
    border: none; 
} 

a:link { 
    color:#414958; 
    text-decoration: underline; 
} 
a:visited { 
    color: #4E5869; 
    text-decoration: underline; 
} 
a:hover, a:active, a:focus { 
    text-decoration: none; 
} 

.container { 
    width: 80%; 
    max-width: 1260px; 
    background: #FFF; 
    margin: 0 auto; 
} 

.header { 
    background-color: #ADB96E; 

} 

.sidebar1 { 

    float: left; 
    width: 20%; 
    background-color: #EADCAE; 
    padding-bottom: 10px; 
} 
.content { 
    padding: 10px 0; 
    width: 60%; 
    float: left; 
} 
.sidebar2 { 
    float: right; 
    width: 20%; 
    background-color: #EADCAE; 
    padding: 10px 0; 
} 

.content ul, .content ol { 
    padding: 0 15px 15px 40px; } 

ul.nav { 
    list-style: none; 
    border-top: 1px solid #666; 
    margin-bottom: 15px; 
} 
ul.nav li { 
    border-bottom: 1px solid #666; 
    list-style: none; 
    position:relative; 
    } 
ul.nav a, ul.nav a:visited { 
    padding: 5px 5px 5px 15px; 
    display: block; 
    text-decoration: none; 
    background-color: #C6D580; 
    color: #000; 
} 
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { 
    background: #ADB96E; 
    color: #FFF; 
} 

/* ~~The footer ~~ */ 
.footer { 
    padding: 10px 0; 
    background: #CCC49F; 
    position: relative; 
    clear: both; 
} 

/* ~~miscellaneous float/clear classes~~ */ 
.fltrt { 
    float: right; 
    margin-left: 8px; 
} 
.fltlft { 
    float: left; 
    margin-right: 8px; 
} 
.clearfloat { 
    clear:both; 
    height:0; 
    font-size: 1px; 
    line-height: 0px; 
} 
.menu { 
    color: #414141; 
    font-size:16px; 
    font-weight:650; 
    text-align: center; 

} 

Answer 1

好吧，我需要更多的條件來準確地回答，但我想有一些CSS樣式myclass。嘗試將myclass重命名爲f-ajax-link-selector（不要忘記在JS中更改它）並嘗試刷新頁面。

Answer 2

你不需要類名中的點（。）。

試試這個：

<li><a class='myclass' href="<?php echo base_url();?>index.php/controller">Search</a></li> 

和jQuery ...

// This means select the `<a>` element with class `myclass`. 
// Dot (.) means class selector. 
$("a.myclass").click(function(){ 
    var link = $(this); 
    var url = link.attr("href"); 
    $(".content").load(url); 

    return false; 

});