2013-09-23 55 views
3

我有一個多選列表,我想禁用通過使用內部的點擊+拖動進行選擇的功能,以便每次點擊只能選擇一個新值 - 但是同時我想繼續將列表作爲「多重」選擇進行操作,以便我仍然可以使用Ctrl +單擊選擇多個值。防止在多個選擇列表中單擊並拖動選擇

我試過在標籤中用onselectstart和ondragstart擺弄,但它們似乎並沒有在多選列表中做任何事情。例如:

<Select id="foo" name="foo[]" multiple="yes" onselectstart="return false" onchange="ajaxFunction()" Size="5"> 
    <option value="" selected>Any</option> 
    <option value="bar" ondragstart=" return false;">foo</option> 
    <option value="foobar">bar</option> 
    <option value="barfoo">foobar</option> 
</Select> 

我懷疑我可能需要使用JavaScript而不是純html。值得注意的是,選擇列表觸發了一個onchange事件,這可能是此的一個關鍵 - 想到的一個想法是以某種方式計算觸發每個onchange事件的選擇次數,如果超過一個,那麼onchange事件中不處理那些值或者該事件被完全取消。但希望有一個更簡單的解決方案。

+0

請張貼一些代碼,也許截圖澄清具體情況。 JSFiddle是解決HTML + CSS + JS問題的好工具。 – chryss

+0

確定編輯 - 我已經採取了多餘的信息,並添加了一些示例代碼。感謝JSFiddle的建議 – user2468499

回答

0

嗯,我找不到在HTML中禁用拖動的方式,但我確實設法通過刷新頁面來中和多個新選擇的功能。似乎很多奇特的步法沒有太大的效果,但無論如何它適用於我的目的。在將此問題標記爲最佳答案之前,我會將此問題留待一兩天,以便任何人提出更好的解決方案。

function ajaxfunction(sel) 
    { 
     var total_selections_counter = 0; 
      //i.e. total selections passed to the onchange event, whether selected previously or not 
     var overlapping_selections_counter = 0; 
      //i.e. selections which were already selected and are also re-selected and passed to the onchange event 
     for (var i = 0; i < sel.options.length; i++) 
      { 
       if(sel.options[i].selected) 
        { 
         total_selections_counter++; 
        } 
       if(sel.options[i].selected && sel.options[i].defaultSelected) 
        { 
         overlapping_selections_counter++; 
        } 
      } 
     var new_selections_counter = total_selections_counter - overlapping_selections_counter; 
     if(new_selections_counter > 1) 
      { 
       location.reload(true); 
      } 
     else 
      { 
       alert("continue processing"); 
      } 
    }