我正在尝试提交视频 url 并返回没有页面刷新或按钮的嵌入代码。我有一个 js 函数可以获取输入框的值。问题是，该函数不会提交将回显嵌入代码的表单。我如何在不单击按钮或刷新的情况下提交表单，以便它可以回显 php 代码？
提交不刷新的JS:
<script>
$(document).ready(function() {
var timer;
$('#video-input1').on('keyup', function() {
var value = this.value;
clearTimeout(timer);
timer = setTimeout(function() {
//do your submit here
$("#ytVideo").submit()
alert('submitted:' + value);
}, 2000);
});
//submit definition. What you want to do once submit is executed
$('#ytVideo').submit(function(e){
e.preventDefault(); //prevent page refresh
var form = $('#ytVideo').serialize();
//submit.php is the page where you submit your form
$.post('index.php', form, function(data){
});
});
});
</script>
HTML
<html>
<form method="post" id="ytVideo" action="">
Youtube URL: <input id="video-input1" type="text" value="<?php $url ?>" name="yurl">
</form>
</html>
PHP
<?php
if($_POST)
{
$url = $_POST['yurl'];
function getYoutubeVideoID($url) {
$formatted_url = preg_replace('~https?://(?:[0-9A-Z-]+\.)?(?:youtu\.be/| youtube\.com\S*[^\w\-\s])([\w\-]{11})
(?=[^\w\-]|$)(?![?=&+%\w]*(?:[\'"][^<>]*>| </a>))[?=&+%\w-]*~ix','http://www.youtube.com/watch?v=$1',$url);
return $formatted_url;
}
$formatted_url = getYoutubeVideoID($url);
$parsed_url = parse_url($formatted_url);
parse_str($parsed_url['query'], $parsed_query_string);
$v = $parsed_query_string['v'];
$hth = 300; //$_POST['yheight'];
$wdth = 500; //$_POST['ywidth'];
//Iframe code
echo htmlentities ('<iframe src="http://www.youtube.com/embed/'.$v.'" frameborder="0" width="'.$wdth.'" height="'.$hth.'"></iframe>');
}
?>
最佳答案
尝试在 .submit() 处理程序的末尾添加 return false:
$('#ytVideo').submit(function(e){
...
$.post(..., function() {
});
return false; // add this
});
关于javascript - JS/AJAX : Submitting form without button click/page refresh issues，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11464366/