2012-05-31 55 views
0

我從jQuery移動開始,並與我的按鈕有一些問題。jQuery手機:正確的方式來使用按鈕?

該Web應用程序是一個購物清單。它顯示要購物的商品列表,以及頁腳按鈕中我可以對商品執行的操作。

的行動是:購買項目的

  1. 增量數
  2. 遞減的項目數量購買
  3. 移動項起來列表
  4. 舉動項目在列表中向下
  5. 添加新項目
  6. 刪除項目
  7. 修改項目文字說明

這些操作在javascript中執行並且正常工作。我遇到的問題是控制按鈕和相關的操作。

根據經驗,我已經看到,對於增量和減量,有一個活動狀態的按鈕更方便,對於其他操作,最好有一個選定的項目並在選定的項目上應用該操作時該按鈕被按下。添加項目時,項目將插入選定項目之前,如果在未選擇項目時按下,則新項目將附加到列表中。

我也想有2種模式。在一種模式下,只顯示遞增和遞減按鈕,用戶可以更新列表中的項目數量。在另一種模式下,用戶正在修改其列表。在第二種模式下,所選項目是必需的。

我設法通過使用.on()方法作爲委託,將我的項目列表的默認操作關聯起來。

$('#itemList').on("click", ".item", function(evt) 
    { ctrl.doAction($(evt.currentTarget)); }); 

這是我用來測試第一種模式的html代碼。

<!-- footer --> 
<div data-role="footer" data-position="fixed" class="ui-bar" id="btnBar" > 
    <a href="" data-role="button" data-icon="plus" id="btnPlus"> Plus </a> 
    <a href="" data-role="button" data-icon="minus" id="btnMinus"> Minus </a> 
</div> 
<!-- /footer --> 

我應該把什麼作爲href值?我不希望頁面被重新加載。在一些例子中,我看到「#」。

這是怎麼了我的動作按鈕關聯:

$('#btnPlus').on("tap", function(evt) 
    { ctrl.doAction = ctrl.increment; }); 

我有另外一個問題是,有按鈕點擊動作沒有反饋。當我點擊一個按鈕時,我希望能在短時間內高亮顯示。這不會發生。

瀏覽器也有不同的行爲。在Firefox中,點擊的按鈕會顯示一個藍色光環,顯然表明它具有焦點。但該按鈕不顯示爲活動。

如果我把「#!」作爲href(不知道它是什麼意思)在Android上,單擊按鈕顯示爲活動。

我應該使用點擊還是點擊作爲事件類型?我怎麼寫點擊或點擊?

我該如何實現顯示爲活動和非活動狀態的兩個狀態按鈕? 如何使用操作按鈕:按下時始終顯示無效並反饋?

回答

0

我解決了我自己的問題。

  1. 來套在頁腳按鈕之間進行切換,創建我的風格= HTML文檔中的多個頁腳:在隱藏頁腳「顯示無」。沒有這個的將顯示。我爲每個頁腳分配了一個特定的id,以便我可以寫入$(「#footer1」)。hide(); $( 「#footer2」)顯示()。

  2. 我有頁腳之間切換的按鈕。必須使用「mouseup」事件調用頁腳切換事件處理程序。這是它在iPad和Android手機上工作所必需的。

  3. 要改變外觀,請不要使用.button(),如此處所示。用途:

    $( 「#myButton的」) .removeClass( 「UI-BTN-UP-一個UI的BTN-下一個UI的BTN-懸停-A」) .addClass(「UI-btn- up-b「) .attr(」data-theme「,」b「);

注:有在我的代碼造成絕望的頭髮拉

錯誤
相關問題