有多個選擇框打開相同的模式對話框

我有一個允許用戶添加用戶到聯繫人列表的表單。我有多個選擇框允許用戶選擇要添加的用戶，但我也希望用戶能夠添加不在列表中的某個人。所以，當新用戶被選中時，我想要一個模式對話框來彈出一個表單來創建一個用戶。無論使用哪個方框，該表單都應顯示出來。因此，我給他們所有相同的類名稱，並且我使用下面的代碼來檢測新的用戶選項。有多個選擇框打開相同的模式對話框

$(function() 
{ 
    $(".select-user").change(function() 
    { 
     alert("List Changed"); 
      if ($(this).val() == 'new') 
      { 
       $("#dialog-form").dialog("open"); 
       updateTips("* indicates a mandatory field."); 
      } 
    }); 
});

但是，只有第一個盒子觸發了這個事件。第一個選擇是這樣定義的：

<select id ="select-user" class = "select-user" name="foo">

其他的盒子都是一樣的，他們開始隱藏。

<select style="visibility:hidden" class="select-user" id="select-user-$index" name="bar">

而且他們正在通過下面的代碼可見：

document.getElementById('select-user-$index').style.visibility = "visible";

我已經證實，.change事件不會引發在所有的任何東西，但第一選擇。有什麼我失蹤的事件是如何觸發的？

編輯：正如我在isherwood的回答中所說的，隔離jsfiddle中的選擇框代碼提供了預期的行爲。所以，有關該頁面的更多信息。這兩個選擇正在由（幾乎）相同的PHP生成。我複製並粘貼它的大部分，但只是添加行來隱藏額外的框，並更改ID。

兩個選擇都是相同的形式。第一個是在一張桌子裏面，而另外一個則被扔進一個桌子。

前兩個之後的每個選擇框都是通過javascript添加的。

來源

2013-03-05 ToxicSockWarrior

警報是在有用於調試的事件。 – ToxicSockWarrior 2013-03-05 00:52:42

在文檔準備就緒並且'$（function（）{}）'觸發之前，您確定其他選擇已經在DOM中了嗎？ – 2013-03-05 00:59:51

它們都是由相同的php文件生成的。所以，他們應該是。 – ToxicSockWarrior 2013-03-05 01:04:24

http://jsfiddle.net/tLYDB/2/

$(function() { 
    $(".select-user").each(function() { 
     $(this).change(function() { 
      alert("List Changed"); 

      if ($(this).val() == 'new') { 
       $("#dialog-form").dialog("open"); 
       updateTips("* indicates a mandatory field."); 
      } 
     }); 
    }); 
});

來源

2013-03-05 01:19:36 isherwood

此代碼仍然存在問題。 – ToxicSockWarrior 2013-03-05 01:33:56

你試過演示了嗎？精美的作品。如果您不同意，請更具體地說明什麼不起作用。 – isherwood 2013-03-05 01:43:38

演示工作正常，但如果我用那個替換我的代碼，行爲根本沒有改變。 – ToxicSockWarrior 2013-03-05 01:48:04

有多個選擇框打開相同的模式對話框

回答

相關問題