JQuery「Any Row」Picker

Question

我正在尋找一個通用的「行選擇器」JQuery。

我們都看到了很酷的「Picker」工具，例如日期選取器，拾色器，時間選取器等等，您可以在文本框中點擊一個小日曆或顏色上顎或時鐘或其他東西。您選擇一些內容（如日期），然後文本框中填充一個值。

我真的需要一個通用的「行選擇器」，你可以用某些數據行（例如時區列表）填充某些東西（表格，div等）。這將鏈接到文本字段，並在用戶點擊該字段時彈出。

他們會點擊一行（例如時區），並且時區標識將被傳回到該字段。

任何人都知道這樣做嗎？

謝謝！

Answer 1

我不知道完全通用，雖然你可以很容易地在jQuery中實現行選擇器。

<script type="text/javascript"> $(function() { 
     $('table#data_table tr').click(function() { 
       alert($(this).find('td.id').html()); 
      }); }); 
</script> 


<table border="0" id="data_table"> 
<tr> 
<td class="id">45</td><td>GMT</td> 
</tr> 
<tr> 
<td class="id">47</td><td>CST</td> 
</tr> 
</table> 

這增加了對每一行的點擊，在行內找到標記的id，然後允許你對它做些什麼。顯然你需要將這個目標定位到你的數據表並根據內容進行過濾。然後可以使用JQuery將點擊結果填充到目標字段中。然後你可以想出一些約定，所有數據表的工作原理都是相同的，這樣你可以把它推廣到你的應用程序的通用選擇器中。

Answer 2

在這種情況下，最好使用事件委派。因此，將事件處理程序放到表本身上，這樣可以避免必須爲每行綁定一個處理程序，如果行數很少，那麼這個處理程序的開銷相當大。然後，您可以使用event.target來查詢哪個元素負責事件並從那裏開始。

更多信息here

如

$('#someTable').click(function(e) { 
    var target = $(e.target); 

}); 

Answer 3

這不正是你問的，但它可能是你在做什麼尋找爲：該Any+Time(TM) Datepicker/Timepicker AJAX Widget with Time Zone Support可以顯示一個列表時區選擇器中的時區，使用戶可以輕鬆選擇適當的時區。它也很容易定製，並且比大多數使用下拉或滑塊的其他時間選擇器允許更快的選擇。我希望這有幫助！

Answer 4

我知道我今年晚了，而且我可能在這裏錯過了一些東西，但size屬性的select元素有什麼問題？

<select name="test" size="5"> 
    <option value="1">One</option> 
    <option value="2">Two</option> 
    <option value="3">Three</option> 
    <option value="4">Four</option> 
    <option value="5">Five</option> 
</select> 

這將顯示所有5個選項，並允許用戶選擇一個。如果只是以標準形式使用，它也完全沒有JavaScript依賴關係，但也可以很好地處理典型的Javascript事件，並且似乎能夠產生您想要的確切外觀 - 更不用說像往常一樣，您可以使用CSS來設計樣式如你所願。

當標準HTML工作時，我會說：使用標準HTML。