Question

<!doctype html>
        <html lang = "en">
           <head>
              <meta charset = "utf-8">
              <title>jQuery UI Autocomplete functionality</title>
              <link href = "https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel = "stylesheet">
              <script src = "https://code.jquery.com/jquery-1.10.2.js"></script>
              <script src = "https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

              <!-- Javascript -->
              <script>
                 $(function() {
                     setLocation();
                 });

                    var cities = [
                        "Adugodi",
                        "Arekere",
                        "Attiguppe",
                        "Yelahanka"
                    ];             

                 function setLocation() {
                    $( "#locName" ).autocomplete({
                       source: cities,
                       minLength: 1,
                       autoFocus:true,
                    select: function(event, ui) {
                        //var value = event.getAttribute('value');
                        var locName = document.getElementById("locName").value;
                        //if (value.includes('&')) {
                        //    value = value.replace("&", "%26");
                        //}
                        console.log( ui.item.label);
                        if (locName === "") {
                            alert("Please Select your Location");
                        } else {
                            document.getElementById("locName").value = ui.item.label;
                            document.getElementById("dropdown_coins").innerHTML =  "Set Location - " + ui.item.label;

                      window.location = "http://www.m.citycontact.in/MyDealers.php?id="+value+"&locName="+locName;      ;
                        }
                        return false;

                    }
                    });                 
                 }

                 function checkLocation() {
                    var locName = document.getElementById("locName").value;  
                    if (locName === "") {
                        alert("Please Select your Location");
                        document.getElementById("locName").focus();
                    } else {
                        var n = cities.includes(locName);
                        if(!n) {
                            alert("Sorry! No such location. Please select location.");
                            document.getElementById("locName").value = "";
                            document.getElementById("dropdown_coins").innerHTML =  " Set Location ";
                            document.getElementById("locName").focus();
window.location = "http://www.m.citycontact.in/MyDealers.php?id="+value+"&locName="+locName;
                        }
                        setLocation();
                    }
                 }
              </script>
           </head>

           <body>
              <!-- HTML --> 
            <div class="dropdown" style=margin-left:500px;margin-top:40px>
                <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdown_coins" data-toggle="dropdown" onclick="checkLocation();" >Set Location</button>
                <div  class="dropdown-menu" style=margin-top:20px>
                    <form>
                        <input type="search" class="form-control" id='locName' placeholder="Search Location" style=margin-top:-60px>
                    </form>

                </div>
            </div>
<div>
    <a href="#"  onclick='Demo(this);' value='Passport agents'  >Passport Agents</a>
      <a href="#"  onclick='Demo(this);' value='Domestic packages'  >Domestic Packages</a>
      <a href="#"  onclick='Demo(this);' value='International packages'  >International packages</a>
      <a href="#"  onclick='Demo(this);' value='Budget Hotel & Lodge'  >Budget Hotel & Lodge</a>
      <a href="#"  onclick='Demo(this);' value='Foreign currency exchange'  >Foreign Currency Exchange</a>
<div>
           </body>
        </html>

选择位置和onclick值后，我已经为我的网站实现了自动完成搜索栏，它应重定向到我的特定页面，即“ http://www.citycontact.in/MyDealers.php?id=” + value +“＆locName =” + locName;但是这里不会发生重定向，值的onclick也能够重定向到同一页面。

Answer 1

您遇到错误：未定义“值”。

Answer 2

您尚未从自动完成插件中回叫值。 ui参数返回到这里...

 select: function(event, ui) {

包含对象

{item : {label: "Adugodi", value: "Adugodi"}}

setLocation的最终代码实现应与此类似，并且也应在检查位置进行相同的修复。

             function setLocation() {
                $( "#locName" ).auhttps://stackoverflow.com/editing-helptocomplete({
                   source: cities,
                   minLength: 1,
                   autoFocus:true,
                select: function(event, ui) {
                    //var value = event.getAttribute('value');
                    var locName = document.getElementById("locName").value;
                    //if (value.includes('&')) {
                    //    value = value.replace("&", "%26");
                    //}
                    console.log( ui.item.label);
                    if (locName === "") {
                        alert("Please Select your Location");
                    } else {
                        document.getElementById("locName").value = ui.item.label;
                        document.getElementById("dropdown_coins").innerHTML =  "Set Location - " + ui.item.label;
                  //*****value changed to ui.item.value, there is no value variable declared
                  window.location = "http://www.m.citycontact.in/MyDealers.php?id="+ui.item.value+"&locName="+locName;      ;
                    }
                    return false;

                }
                });                 
             }

选择位置后无法重定向到我的特定页面

2 个答案: