建站
咨詢
售后
建站咨詢
新聞中心
7 click 綁定
目的
創(chuàng)新互聯(lián)建站是一家以網(wǎng)絡技術公司，為中小企業(yè)提供網(wǎng)站維護、成都網(wǎng)站建設、做網(wǎng)站、網(wǎng)站備案、服務器租用、主機域名、軟件開發(fā)、重慶小程序開發(fā)等企業(yè)互聯(lián)網(wǎng)相關業(yè)務，是一家有著豐富的互聯(lián)網(wǎng)運營推廣經(jīng)驗的科技公司，有著多年的網(wǎng)站建站經(jīng)驗，致力于幫助中小企業(yè)在互聯(lián)網(wǎng)讓打出自已的品牌和口碑，讓企業(yè)在互聯(lián)網(wǎng)上打開一個面向全國乃至全球的業(yè)務窗口：建站咨詢熱線：18980820575
click綁定在DOM元素上添加事件句柄以便元素被點擊的時候執(zhí)行定義的JavaScript 函數(shù)。大部分是用在button，input和連接a上，但是可以在任意元素上使用。
例子
You've clicked times
每次點擊按鈕的時候，都會調(diào)用incrementClickCounter()函數(shù)，然后更新自動更新點擊次數(shù)。
參數(shù)
主參數(shù)
Click點擊事件時所執(zhí)行的函數(shù)。
你可以聲明任何JavaScript函數(shù) – 不一定非要是view model里的函數(shù)。你可以聲明任意對象上的任何函數(shù)，例如： someObject.someFunction。
View model上的函數(shù)在用的時候有一點點特殊，就是不需要引用對象的，直接引用函數(shù)本身就行了，比如直接寫incrementClickCounter 就可以了，而無需寫成： viewModel.incrementClickCounter（盡管是合法的）。
其它參數(shù)
無
注1：傳參數(shù)給你的click 句柄
最簡單的辦法是傳一個function包裝的匿名函數(shù)：
這樣，KO就會調(diào)用這個匿名函數(shù)，里面會執(zhí)行viewModel.myFunction()，并且傳進了'param1' 和'param2'參數(shù)。
注2：訪問事件源對象
有些情況，你可能需要使用事件源對象，Knockout會將這個對象傳遞到你函數(shù)的第一個參數(shù)：
如果你需要的話，可以使用匿名函數(shù)的第一個參數(shù)傳進去，然后在里面調(diào)用：
這樣，KO就會將事件源對象傳遞給你的函數(shù)并且使用了。
注3: 允許執(zhí)行默認事件
默認情況下，Knockout會阻止冒泡，防止默認的事件繼續(xù)執(zhí)行。例如，如果你點擊一個a連接，在執(zhí)行完自定義事件時它不會連接到href地址。這特別有用是因為你的自定義事件主要就是操作你的view model，而不是連接到另外一個頁面。
當然，如果你想讓默認的事件繼續(xù)執(zhí)行，你可以在你click的自定義函數(shù)里返回true。
注4：控制this句柄
初學者可以忽略這小節(jié)，因為大部分都用不著，高級用戶可以參考如下內(nèi)容：
KO在調(diào)用你定義的函數(shù)時，會將view model傳給this對象（也就是ko.applyBindings使用的view model）。主要是方便你在調(diào)用你在view model里定義的方法的時候可以很容易再調(diào)用view model里定義的其它屬性。例如： this.someOtherViewModelProperty。
如果你想引用其它對象，我們有兩種方式：
-
你可以和注1里那樣使用匿名函數(shù)，因為它支持任意JavaScript 對象。
- 你也可以直接引用任何函數(shù)對象。你可以使用bind使callback函數(shù)設置this為任何你選擇的對象。例如：
如果你是C#或Java開發(fā)人員，你可以疑惑為什么我們還要用bind函數(shù)到一個對象想，特別是像調(diào)用someObject.someFunction。 原因是在JavaScript里，函數(shù)自己不是類的一部分，他們在單獨存在的對象，有可能多個對象都引用同樣的someFunction函數(shù)，所以當這個函數(shù)被調(diào)用的時候它不知道誰調(diào)用的（設置this給誰）。在你bind之前運行時是不會知道的。KO默認情況下設置this對象是view model，但你可以用bind語法重定義它。
在注1里使用匿名函數(shù)的時候沒有具體的要求，因為JavaScript代碼 someObject.someFunction()就意味著調(diào)用someFunction，然后設置this到 someObject對象上。
注5：防止事件冒泡
默認情況下，Knockout允許click事件繼續(xù)在更高一層的事件句柄上冒泡執(zhí)行。例如，如果你的元素和父元素都綁定了click事件，那當你點擊該元素的時候兩個事件都會觸發(fā)的。如果需要，你可以通過額外的綁定clickBubble來禁止冒泡。例如：
默認情況下，myButtonHandler會先執(zhí)行，然后會冒泡執(zhí)行myDivHandler。但一旦你設置了clickBubble為false的時候，冒泡事件會被禁止。
依賴性
除KO核心類庫外，無依賴。
8 event 綁定
目的
event綁定在DOM元素上添加指定的事件句柄以便元素被觸發(fā)的時候執(zhí)行定義的JavaScript 函數(shù)。大部分情況下是用在keypress，mouseover和mouseout上。
例子
Mouse over me
Details
每次鼠標在第一個元素上移入移出的時候都會調(diào)用view model上的方法來toggle detailsEnabled的值，而第二個元素會根據(jù)detailsEnabled的值自動顯示或者隱藏。
參數(shù)
主參數(shù)
你需要傳入的是一個JavaScript對象，他的屬性名是事件名稱，值是你所需要執(zhí)行的函數(shù)。
你可以聲明任何JavaScript函數(shù) – 不一定非要是view model里的函數(shù)。你可以聲明任意對象上的任何函數(shù)，例如： event: { mouseover: someObject.someFunction }。
View model上的函數(shù)在用的時候有一點點特殊，就是不需要引用對象的，直接引用函數(shù)本身就行了，比如直接寫event: { mouseover: enableDetails } 就可以了，而無需寫成： event: { mouseover: viewModel.enableDetails }（盡管是合法的）。
其它參數(shù)
無
注1：傳參數(shù)給你的click 句柄
最簡單的辦法是傳一個function包裝的匿名函數(shù)：
這樣，KO就會調(diào)用這個匿名函數(shù)，里面會執(zhí)行viewModel.myFunction()，并且傳進了'param1' 和'param2'參數(shù)。
注2：訪問事件源對象
有些情況，你可能需要使用事件源對象，Knockout會將這個對象傳遞到你函數(shù)的第一個參數(shù)：
Mouse over me
如果你需要的話，可以使用匿名函數(shù)的第一個參數(shù)傳進去，然后在里面調(diào)用：
Mouse over me
這樣，KO就會將事件源對象傳遞給你的函數(shù)并且使用了。
注3: 允許執(zhí)行默認事件
默認情況下，Knockout會阻止冒泡，防止默認的事件繼續(xù)執(zhí)行。例如，如果在一個input標簽上綁定一個keypress事件，當你輸入內(nèi)容的時候，瀏覽器只會調(diào)用你的函數(shù)而不是天價你輸入的值。另外一個例子click綁定，當你點擊一個a連接，在執(zhí)行完自定義事件時它不會連接到href地址。因為你的自定義事件主要就是操作你的view model，而不是連接到另外一個頁面。
當然，如果你想讓默認的事件繼續(xù)執(zhí)行，你可以在你event的自定義函數(shù)里返回true。
注4：控制this句柄
初學者可以忽略這小節(jié)，因為大部分都用不著，高級用戶可以參考如下內(nèi)容：
KO在調(diào)用你定義的event綁定函數(shù)時，會將view model傳給this對象（也就是ko.applyBindings使用的view model）。主要是方便你在調(diào)用你在view model里定義的方法的時候可以很容易再調(diào)用view model里定義的其它屬性。例如： this.someOtherViewModelProperty。
如果你想引用其它對象，我們有兩種方式：
- 你可以和注1里那樣使用匿名函數(shù)，因為它支持任意JavaScript 對象。
- 你也可以直接引用任何函數(shù)對象。你可以使用bind使callback函數(shù)設置this為任何你選擇的對象。例如：
Mouse over me
如果你是C#或Java開發(fā)人員，你可以疑惑為什么我們還要用bind函數(shù)到一個對象想，特別是像調(diào)用someObject.someFunction。 原因是在JavaScript里，函數(shù)自己不是類的一部分，他們在單獨存在的對象，有可能多個對象都引用同樣的someFunction函數(shù)，所以當這個函數(shù)被調(diào)用的時候它不知道誰調(diào)用的（設置this給誰）。在你bind之前運行時是不會知道的。KO默認情況下設置this對象是view model，但你可以用bind語法重定義它。
在注1里使用匿名函數(shù)的時候沒有具體的要求，因為JavaScript代碼 someObject.someFunction()就意味著調(diào)用someFunction，然后設置this到 someObject對象上。
注5：防止事件冒泡
默認情況下，Knockout允許event事件繼續(xù)在更高一層的事件句柄上冒泡執(zhí)行。例如，如果你的元素和父元素都綁定了mouseover事件，那么如果你的鼠標在該元素移動的時候兩個事件都會觸發(fā)的。如果需要，你可以通過額外的綁定youreventBubble來禁止冒泡。例如：
默認情況下，myButtonHandler會先執(zhí)行，然后會冒泡執(zhí)行myDivHandler。但一旦你設置了mouseoverBubble為false的時候，冒泡事件會被禁止。
依賴性
除KO核心類庫外，無依賴。
9 submit 綁定
目的
submit綁定在form表單上添加指定的事件句柄以便該form被提交的時候執(zhí)行定義的JavaScript 函數(shù)。只能用在表單form元素上。
當你使用submit綁定的時候， Knockout會阻止form表單默認的submit動作。換句話說，瀏覽器會執(zhí)行你定義的綁定函數(shù)而不會提交這個form表單到服務器上。可以很好地解釋這個，使用submit綁定就是為了處理view model的自定義函數(shù)的，而不是再使用普通的HTML form表單。如果你要繼續(xù)執(zhí)行默認的HTML form表單操作，你可以在你的submit句柄里返回true。
例子
這個例子里，KO將把整個form表單元素作為參數(shù)傳遞到你的submit綁定函數(shù)里。 你可以忽略不管，但是有些例子里是否有用，參考：ko.postJson工具。
為什么不在submit按鈕上使用click綁定？
在form上，你可以使用click綁定代替submit綁定。不過submit可以handle其它的submit行為，比如在輸入框里輸入回車的時候可以提交表單。
參數(shù)
主參數(shù)
你綁定到submit事件上的函數(shù)
你可以聲明任何JavaScript函數(shù) – 不一定非要是view model里的函數(shù)。你可以聲明任意對象上的任何函數(shù)，例如： submit: someObject.someFunction。
View model上的函數(shù)在用的時候有一點點特殊，就是不需要引用對象的，直接引用函數(shù)本身就行了，比如直接寫submit: doSomething就可以了，而無需寫成： submit: viewModel. doSomething（盡管是合法的）。
其它參數(shù)
無
備注：
關于如果傳遞更多的參數(shù)給submit綁定函數(shù)，或者當調(diào)用非view model里的函數(shù)的時如何控制this，請參考click綁定。所有click綁定相關的notes也都適用于submit綁定。
依賴性
除KO核心類庫外，無依賴。
10 enable 綁定
目的
enable綁定使DOM元素只有在參數(shù)值為 true的時候才enabled。在form表單元素input，select，和textarea上非常有用。
例子
I have a cellphone
Your cellphone number:
這個例子里，“Your cellphone number”后的text box 初始情況下是禁用的，只有當用戶點擊標簽 “I have a cellphone”的時候才可用。
參數(shù)
主參數(shù)
聲明DOM元素是否可用enabled。
非布爾值會被解析成布爾值。例如0和null被解析成false，21和非null對象被解析給true。
如果你的參數(shù)是observable的，那綁定會隨著observable值的改變而自動更新enabled/disabled狀態(tài)。如果不是，則只會設置一次并且以后不再更新。
其它參數(shù)
無
注：任意使用JavaScript表達式
不緊緊限制于變量 – 你可以使用任何JavaScript表達式來控制元素是否可用。例如,
依賴性
除KO核心類庫外，無依賴。
11 disable 綁定
目的
disable綁定使DOM元素只有在參數(shù)值為 true的時候才disabled。在form表單元素input，select，和textarea上非常有用。
disable綁定和enable綁定正好相反，詳情請參考enable綁定。
網(wǎng)站題目：創(chuàng)新互聯(lián)Knockout教程：綁定語法（2）
瀏覽地址：http://www.5511xx.com/article/cohjgph.html
