JQuery mobile搜索輸入圖標

Question

我想知道什麼是最好的方法來使這個放大鏡圖標進入可點擊的按鈕？ 不改變jQuery框架

http://jquerymobile.com/demos/1.0a2/#docs/forms/forms-search.html

這是它的映射框架

if(input.is('[type="search"],[data-type="search"]') 
focusedEl = input.wrap('<div class="ui-input-search ui-shadow-inset ui-btn-corner-all ui-btn-shadow ui-icon-search'+ themeclass +'"></div>').parent(); 

Answer 1

最好的，我可以告訴它是一個div主題與輸入元素。話雖這麼說，你可能可以做兩件事情之一：

綁定到輸入的包裝，如：

$('__INPUT_SELECTOR__') // grab the input field 
    .closest('div')  // traverse up to the parent div 
    .bind('click',function(){ 
    // grab the click event and make it a form submit 
    $(this).closest('form').submit(); 
    }); 

OR，你去其他方向：

$('div.ui-input-search') // find the div first 
    .bind('click',function(){ 
    // now you have a click event on the div. Transfer it to the form's submit 
    $(this).closest('form').submit(); 
    }); 

只是取決於你想去的方向。 （可能應該使用jquerymobile事件，而不是經典的jQuery（這樣你可以捕捉到figner輕拍等））另外，這應該被解釋爲僞代碼，因爲我對庫不熟悉，我知道的。

編輯
所以很明顯，我實現更多也要做（在檢查方面）的DIV的click事件。您需要測試實際在DIV上執行的點擊，而不是導致DIV事件觸發的輸入。
只是拋出它，以避免「這不行」的評論。這就是爲什麼它是僞代碼。

Answer 2

用JavaScript hack做什麼都會破壞整個progressive enhancement想法。

只需創建一個正常的提交按鈕，用<span class="maglass">包裝它，然後就克里特島一些CSS規則，!important在年底覆蓋jQuery Mobile的按鈕樣式JQM創建替換提交按鈕的元素（使用Firebug檢查它以掌握在那裏創建的東西） 最後 - 如果你希望在半支持的瀏覽器中看起來不錯，你必須得到其中一個並添加另一個CSS規則。

完成。有不支持的瀏覽器的按鈕，它增強了CSS的放大鏡。無處不在。