如何在Jquery脚本中编写动态URL

我正在尝试使用jquery用数据填充一个表，并通过URL访问php数据库。当我预定义输入时，它可以工作，但我不知道如何让它与输入一起工作

Q：脚本中用于输入字段的正确URL是什么？

数据库URL:

（注释的脚本可以工作，但这不是我应该使用的URL。）

重要！我只允许在js文件中进行更改

欢迎所有帮助！：）

HTML:

营养表
Sökning av livsmedel酒店
利夫斯梅尔
斯科克
利夫斯梅尔
能源（千卡/100克）
Kolhydrater
蛋白质
费特

JS:

$（“#sok按钮”）。单击（函数（）{
//$（“#搜索词”）。在（'change paste keyup'，function（）上{
//列表中的内容为空
$（'#resultat'）.empty（）；
//从输入获取内容
var forNamnStr=$（“#搜索词”）.val（）；
//如果有内容（长度大于0）
如果（forNamnStr.length>0）{
//向web服务执行问题
`$.ajax({
//url:“https://webservice.informatik.umu.se/webservice_persondb/persondb.php",
url:“https://webservice.informatik.umu.se/webservice_livsmedel/getlivsmedel.php? 
namn=bacon&callback=getLivsmedel“，
数据类型：“jsonp”，
数据：{
限额：15，
姓名：forNamnStr
},
//如果响应成功
成功：功能（响应）{
var person=响应。个人；
var livsmedel=response.livsmedel；
//循环浏览所有person对象
//person.forEach（功能（namn）{
livsmedel.forEach（功能（营养）{
//将li元素添加到id=resultat的ul元素
//$（'tbody'）.append（'li>'+namn.fnamn+'+namn.enamn+''）；
$（'tbody'）。追加（'li>'+nutrition.protein+''+nutrition.fett+
“”）；
});
}
});
}
});

我想您正在尝试将#search word输入字段值作为url中的

namn=

参数传递

您可以像这样使用串联

$.ajax({        
        url: "https://webservice.informatik.umu.se/webservice_livsmedel/getlivsmedel.php? 
namn=" + forNamnStr + "&callback=getLivsmedel",
.....
}

注意：$.ajax调用中随

data:

属性传递的任何值也将作为

&key=value

附加到url中（即，它不会检查重复项）。

---

因此，要么传入

数据：

属性，要么使用连接直接传入url。

非常感谢您的帮助，它工作得非常好。

$( "#sok-button" ).click(function() {

//$('#search-word').on('change paste keyup', function () {
//Empty content in list
$('#resultat').empty();
// Gets content from input
var forNamnStr = $('#search-word').val();

//If there is content (length is more than 0)
if (forNamnStr.length > 0) {
    //Performs a question to the web service
 `$.ajax({
        //url: "https://webservice.informatik.umu.se/webservice_persondb/persondb.php",
        url: "https://webservice.informatik.umu.se/webservice_livsmedel/getlivsmedel.php? 
namn=bacon&callback=getLivsmedel",
        dataType: "jsonp",
        data: {
            limit: 15,
            name: forNamnStr
        },
        // If respons is successful
        success: function (response) {
            var person = response.personer;
            var livsmedel = response.livsmedel;
            // Cycle through all person objects
            //person.forEach(function (namn) {
            livsmedel.forEach(function (nutrition) {
                
                //Add li-element to ul-element with id=resultat
                //$('tbody').append('<li>' + namn.fnamn + ' ' + namn.enamn + '</li>');
                $('tbody').append('<li>' + nutrition.protein + ' ' + nutrition.fett + 
'</li>');
                
            });

        }
    });
}
});

$.ajax({        
        url: "https://webservice.informatik.umu.se/webservice_livsmedel/getlivsmedel.php? 
namn=" + forNamnStr + "&callback=getLivsmedel",
.....
}