Javascript元素ID到AJAX url

Question

我想製作一個包含幾個輸入字段的表單。在這些字段中輸入內容時，必須出現包含來自MySQL數據庫的匹配記錄的下拉列表。以下是JavaScript代碼：

<script type="text/javascript"> 
    $(function() { 
     $("#sampleprep, #quantity, #sampletype, #organism").autocomplete({ 
      response: function(event, ui) { 
       try { 
        // ui.content is the array that's about to be sent to the response callback. 
        if (ui.content.length === 0) { 
         $("#"+event.target.id+"-empty-message").text("No results found"); 
        } else { 
         $("#"+event.target.id+"-empty-message").empty(); 
         //$("#"+event.target.id+"-empty-message").text(event.target.id); 
        } 
       } catch(err) { 
        error = "Error 1: "+err.message; 
        alert(error); 
       } 
      }, 

      source: function(request, response) { 
       try { 
        var target_id = "sampletype";   <==== 

        $.ajax({ 
         url: "list_"+target_id+".php",  <==== 
         dataType: "json", 
         data: { 
          term : request.term 
         }, 
         success: function(data) { 
          response(data); 
         } 
        }); 
       } catch(err) { 
        error = "Error 2: "+err.message; 
        alert(error); 
       } 
      }, 
      minlength: 1 
     }); 
    }); 
</script> 

正如你所看到的，有使用此代碼4個輸入字段：

• sampleprep
• 量
• sampletype
• 生物

每個輸入字段對應於它的o wn數據庫表。我製作了4個PHP文件來獲取匹配的數據。文件名是：

• list_sampleprep.php
• list_quantity.php
• list_sampletype.php
• list_organism.php

我的問題是由箭頭指示<====。現在，網址固定爲list_sampletype.php。我想使這個動態，但我不知道如何獲得輸入字段的id到ajax調用。我嘗試了event.target.id，它在第一個函數中工作，還有一些其他的東西，但沒有任何回報我想要的。

Answer 1

你可以嘗試這樣的事情：

<script type="text/javascript"> 
    $(function() { 
     $(".ajax_getid_").each(function() { 
      (function ($this) { 
       $this.autocomplete({ 
       response: function(event, ui) { 
        try { 
         // ui.content is the array that's about to be sent to the response callback. 
        if (ui.content.length === 0) { 
         $("#"+event.target.id+"-empty-message").text("No results found"); 
        } else { 
         $("#"+event.target.id+"-empty-message").empty(); 
         //$("#"+event.target.id+"-empty-message").text(event.target.id); 
        } 
         } catch(err) { 
          error = "Error 1: "+err.message; 
          alert(error); 
         } 
        }, 

        source: function(request, response) { 
         try { 
          var target_id = "sampletype";   <==== 

          $.ajax({ 
           url: "list_"+$this.attr('id')+".php",  <==== 
           dataType: "json", 
           data: { 
            term : request.term 
           }, 
           success: function(data) { 
            response(data); 
           } 
          }); 
         } catch(err) { 
          error = "Error 2: "+err.message; 
          alert(error); 
         } 
        }, 
        minlength: 1 
       }); 
      })($(this)); 
     }); 
    }); 
</script> 

爲了解釋：對於每一個元素，您將執行相同的功能，您將使用選擇的元素的ID。