首页 > 解决方案 > 如何将 php/html 中的程序名称作为变量传递给 javascript,而不是在“$.get”语句中对其进行硬编码

问题描述

我有一个JQuery/Javascript在我的php/html程序中使用的下拉列表。如果我硬编码运行 SQL 以将数据加载到下拉列表中的程序的名称,这将很好。我希望这段代码是可重用的,而不是为每个下拉列表复制它(我希望在当前实例中有 2 个),所以我想知道如何在每个下拉列表访问不同的文件时传递不同的程序名称。示例:ClubID 下拉列表需要clubsusing的数据,clubsSearch.php但 MemberTypeID 需要memtypusing的数据memtypSearch.php。这是 Javascript,包括我将程序名称作为变量传递的最新努力:

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
    
    $('.search-box input[type="text"]').on("click input", function()
    {
        /* Get input value on change */
        var srchName =  <?php echo $SearchName?>;
        var inputVal = $(this).val();
        var resultDropdown = $(this).siblings(".result");
        if(inputVal.length){
            $.get(srchName, {term: inputVal}).done(function(data){
                // Display the returned data in browser
                resultDropdown.html(data);
            });
        } else{
            resultDropdown.empty();
        }
    });
    
    // Set search input value on click of result item
    $(document).on("click", ".result p", function(){
        $(this).parents(".search-box").find('input[type="text"]').val($(this).text());
        $(this).parent(".result").empty();
    });
});
</script> 

如果我使用

$.get("clubsSearch.php", {term: inputVal}).done(function(data){

它工作正常。

表格的相关部分是:

    <div class="col-6 col-md-4">
        <div class="form-group <?php echo (!empty($ClubIDer)) ? 'has-error' : ''; ?>">
        <label>Club ID:</label>
        <div class="search-box">
             <input type="hidden"  name="clubID" value="<?php $SearchName = "\"clubsSearch.php\"";? 
                           >" >   
             <input type="text"  name="ClubID" autocomplete="off"  class="form-control" 
                          value="<?php echo $ClubID; ?>" >
             <?php echo $SearchName?>
                 <div class="result">
                 </div>
            <span class="help-block"><?php echo $ClubIDer;?></span>
            </div>                          
        </div>
  </div>  

显示**$SearchName**为“ clubsSearch.php”,但在 Chrome 的开发人员工具中,我可以看到 javascript 无法识别变量var srchName = ;x 并且没有出现下拉列表。

谁能告诉我如何将搜索名称呈现给 javascript,因为我完全不熟悉它。任何援助将不胜感激。

标签: javascriptphphtmljqueryvariables

解决方案


在 data-attr 中传递程序名称,如

<select name="WHATEVER" id="WHATEVER" data-program="YOUR_PROGRAM_NAME">

在 JS 中得到它喜欢

var srchName = $(this).attr("data-program");

推荐阅读