2012-03-20 85 views
0

HTML針對特定鏈接: 我已經附加我面臨的問題的一個簡單的例子:使用jQuery 1.4或JavaScript我怎麼會用一個變量

<h2>Product2</h2> 
<div id="products"> 

    <a class="my-product1" href="#"><span>my-product1<span></a> 
    <a class="my-product2" href="#"><span>my-product2<span></a> 
    <a class="my-product3" href="#"><span>my-product3<span></a> 
    <a class="my-product4" href="#"><span>my-product4<span></a> 
    <a class="my-product5" href="#"><span>my-product5<span></a> 

</div>​ 

的Javascript: 我已經從頁面標題拉取myProduct並強制小寫。接下來,我試圖從基於其類的鏈接組中刪除該產品。它很可能這是jquery101但是我不知道如何添加一個類到鏈接使用變量來確定選擇哪個類。在這個例子讓我們假設VAR myProduct的產品2 =

function removeProduct(myProduct){ 
    $("a.myProduct").addClass("display-none"); 
}; 

此外,我還在學習,所以如果你有時間的,爲什麼我在做什麼是錯的會很長的路要走簡要explination。謝謝你的時間!

+1

的jQuery 4.4 ....你發明了時間旅行? [jQuery的當前版本(http://docs.jquery.com/Downloading_jQuery#Current_Release) – ManseUK 2012-03-20 14:02:22

+0

@ManseUK我猜他的意思1.4 ... – Andre 2012-03-20 14:11:59

+0

@Andre我從來不喜歡猜......他可能意味着'Prototype'或'Dojo' ..... – ManseUK 2012-03-20 14:16:45

回答

2

分離的串選擇簡單CONCAT類名來選擇字符串:

$("a."+variable)... 

額外您所要求的信息:

不要使用類「顯示無」 ...更改其名稱或使用jQuery隱藏元素的本地代碼(hidedocs))

function removeProduct(myProduct){ 
    $("a." + myProduct).hide(); 
}; 

更改CSS規則與cssdocs)函數:

function removeProduct(myProduct){ 
    $("a." + myProduct).css('display', 'none'); 
}; 

添加類是與addClass功能:

function removeProduct(myProduct){ 
    $("a." + myProduct).addClass('someClass'); 
}; 

變化myProductremoveProduct名稱,以更有意義的變量名:

function hideAnchorElement(className){ 
    $("a." + className).hide();   
} 
+0

謝謝,這幫助了很多,我明白這一切。我仍然要錯過一些東西,但我的劇本仍然無法運作。你介意看看我的Jsfiddle嗎? http://jsfiddle.net/bms85/W4fAX/29/ – 2012-03-20 14:39:58

+0

@ Bms85smb。固定[小提琴](http://jsfiddle.net/W4fAX/30/)。幾件事情。 ** 1。**用jsLint檢查你的代碼。 ** 2。**不要使用全局變量(在你的情況下''myProduct'是一個)。 – gdoron 2012-03-20 14:48:15

+0

非常感謝!你介意解釋你爲什麼重新排序功能嗎?以及爲什麼重新排序他們造成了所有差異? – 2012-03-20 16:39:13

0

您正在尋找這樣的:

function removeProduct(myProduct){ 
    $("a."+myProduct).addClass("display-none"); 
}; 

從變量

1

class屬性/屬性用作一個通用的選擇 - 即你可以申請一個類的多個對象......在id屬性/屬性用於特定的選擇 - 並且是獨一無二的。我建議你改變你的HTML使用id!而非class小號

試着這麼做:

function removeProduct(myProduct){ 
    $("a."+myProduct).css("display","none"); 
}; 

使用.css()display屬性更改爲none

function removeProduct(myProduct){ 
    $("a."+myProduct).hide(); 
}; 

.hide()做同樣的事情爲.css()方法做上述

function removeProduct(myProduct){ 
    $("a."+myProduct).addClass("yourclass"); 
}; 

其中yourclass是要應用到元素的類。

而且我可以建議你看一看How jQuery works

0

,如果你想隱藏小提琴是here上單擊事件

$(function(){ 
    $('#products a').on('click', function(e){ 
     e.preventDefault(); 
     $(this).hide(); 
    }); 
});​ 

鏈接試試這個。

相關問題