javascript AJAX 发布请求和字符串连接
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19877968/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AJAX post request and string concatenation
提问by user2970730
I am using jQuery/AJAX to do a post request. I am trying to take the input from the first textbox and concatenate that with a url and display result in the second textbox. Example, If user types in asdf
the ajax function will then make the post and the result will display as http://www.example.com/sdf/
. I have two problems, As mentioned early I have a ajax function that it is performing post but no result is diplaying in the html(it does show in the firebug console). Second, How can I concatenate the input into the url.
Live Site
我正在使用 jQuery/AJAX 来做一个发布请求。我正在尝试从第一个文本框中获取输入并将其与 url 连接并在第二个文本框中显示结果。例如,如果用户在asdf
ajax 函数中键入,则将发布帖子,结果将显示为http://www.example.com/sdf/
. 我有两个问题,正如前面提到的,我有一个 ajax 函数,它正在执行 post 但没有结果显示在 html 中(它确实显示在萤火虫控制台中)。其次,如何将输入连接到 url 中。
现场直播
<script>
$(document).ready(function () {
var timer = null;
var dataString;
function submitForm() {
$.ajax({
type: "POST",
url: "/concatenate/index.php",
data: dataString,
dataType: "html",
success: function (data) {
$("#result").html(data);
}
});
return false
}
$("#input").on("keyup", function() {
clearTimeout(timer);
timer = setTimeout(submitForm, 40);
var input = $("#input").val();
dataString = { input : input }
})
});
</script>
</head>
<body>
<h1>Enter a word:</h1>
<form action="create_entry.php" method="post">
Input: <input type="text" id="input" name="zipcode"></br>
Concatenated Result: <input type="text" id="result" name="location" value="http//www.example.com/ /" readonly></br>
</form>
回答by charlietfl
I would suggest you pass parameters into submitForm
instead of using a global variable for data.
我建议您将参数传入submitForm
而不是使用全局变量来存储数据。
To do concatenation could store the original value of the input using .data()
method and always grab that and then add your new value to it.
要进行连接,可以使用.data()
方法存储输入的原始值并始终获取该值,然后将新值添加到其中。
<!-- remove extra space and "/" -->
<input type="text" id="result" name="location" value="http//www.example.com/" readonly>
$(document).ready(function () {
var timer = null;
/* cache $("#result") and store initial url value*/
var $result=$("#result");
$result.data('url',$result.val());
function submitForm( input ) {
$.ajax({
type: "POST",
url: "/concatenate/index.php",
data: {input:input},
dataType: "html",
success: function (data) {
/* new value from stored url and new user input*/
var url=$result.data('url'),
newUrl= url+data;
/* use val() not html() */
$result.val(newUrl);
}
});
return false
}
$("#input").on("keyup", function() {
/* no point using "$("#input")" to search DOM again when already have "this"*/
var input = $(this).val();
clearTimeout(timer);
timer = setTimeout(function(){
submitForm(input) ;
}, 40);
})
});
回答by Vicky Gonsalves
it should be
它应该是
success: function (data) {
$("#result").val( 'http//www.example.com/'+data+'/');
}
回答by user2511140
chage this
改变这个
success: function (data) {
$("#result").html(data);
}
to this
对此
success: function (data) {
$("#result").attr('value','http//www.example.com/'+data+'/');
}