无需页面刷新或单击按钮即可从URL抓取值

Question

我现在创建了一个表单，它接受youtube链接并解析/正则表达式提取ID，该函数通过单击按钮来执行，然后打印出URL的ID。有没有办法让它在不点击按钮和刷新页面的情况下显示ID？EXAMPLE

if(isset($_POST['ytinput'])){

function getYoutubeId($sYoutubeUrl) {

    # set to zero
    $youtube_id = "";
    $sYoutubeUrl = trim($sYoutubeUrl);

    # the User entered only the eleven chars long id, Case 1
    if(strlen($sYoutubeUrl) === 11) {
        $youtube_id = $sYoutubeUrl;
        return $sYoutubeUrl;
    }

    # the User entered a Url
    else {

        # try to get all Cases
        if (preg_match('~(?:youtube\.com/(?:user/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\.be/)([^"&?/ ]{11})~i', $sYoutubeUrl, $match)) {
            $youtube_id = $match[1];
            return $youtube_id;
        }
        # try to get some other channel codes, and fallback extractor
        elseif(preg_match('~http://www.youtube.com/v/([A-Za-z0-9\-_]+).+?|embed\/([0-9A-Za-z-_]{11})|watch\?v\=([0-9A-Za-z-_]{11})|#.*/([0-9A-Za-z-_]{11})~si', $sYoutubeUrl, $match)) {

            for ($i=1; $i<=4; $i++) {
                if (strlen($match[$i])==11) {
                    $youtube_id = $match[$i];
                    break;
                }
            }
            return $youtube_id;
        }
        else {
            $youtube_id = "No valid YoutubeId extracted";
            return $youtube_id;
        }
    }
}


 print 'Result: ' . getYoutubeId($_POST['ytinput']);

}


?>


<form action="" method="POST">
    <input type="text" name="ytinput" value="<? $sYoutubeUrl ?>">
    <input type="submit" value="Parsen">
</form>

Answer 1

实现这一点的方法是通过Javascript使用Ajax。

注意:此解决方案需要使用jQuery JavaScript库。请参阅http://jquery.com/

首先，我们需要从表单中获取url，方法如下：

var sYoutubeUrl = $('input [name="ytinput"]').val();

然后，我们需要向您的函数文件发出Ajax请求，并获得结果。

$.ajax({
        type: 'get',
        url: '<relative link to function file>/file.php',
        data: 'sYoutubeUrl='+sYoutubeUrl,

        //Catch the result
        success: function(response) {
            //Assign response to a variable
            var youtube_id = response;
            //Display response inside the form
            $('input [name="ytinput"]').val('youtube_id');
        },

    });

这只是一个基本的指南，你需要稍微改变你的php文件，也改变你的表单从一个POST触发的表单。此外，您还需要将我给您的JS放在一个触发器事件中，可能是在表单提交中，如下所示：

$('form').submit(function() {
   //Code above here
});