2

我希望用户提交 youtube 网址。如果 youtube 链接正确，我想“即时”检查，如果检查成功，则将输入旁边的文本更改为 OK。

我设法制作了一个验证功能，但它不起作用。我究竟做错了什么？

更新

它仍然不起作用，当 URL 不正确时它应该说 not ok，当 URL 正确时它应该在输入时说：

            $('form #youtube').bind("change keyup input", validYT());
        function validYT()
        {

            var url = $('form #youtube').val();
            var p = /^(?:https?:\/\/)?(?:www\.)?youtube\.com\/watch\?(?=.*v=((\w|-){11}))(?:\S+)?$/;
            if (url.match(p)) {
                $('#ytInfo').removeClass().addClass('fieldok ').text('OK');
                return true
            }
            else
            {
                $('#ytInfo').removeClass().addClass('fieldok ').text('NOT OK');
                return false
            }
        }

HTML：

youtubelink<BR>
<input type="text" name="youtube" id ="youtube" value="" /><div id="ytlInfo">dd</div>
4

2 回答 2

11 
function validYT(url) {
  var p = /^(?:https?:\/\/)?(?:www\.)?youtube\.com\/watch\?(?=.*v=((\w|-){11}))(?:\S+)?$/;
   return (url.match(p)) ? RegExp.$1 : false;
}

谢谢@eyecatchUp https://stackoverflow.com/a/10315969/1250044

更新

function ytVidId(url) {
    var p = /^(?:https?:\/\/)?(?:www\.)?youtube\.com\/watch\?(?=.*v=((\w|-){11}))(?:\S+)?$/;
    return (url.match(p)) ? RegExp.$1 : false;
}

$('#youtube').bind("change keyup input", function() {
    var url = $(this).val();
    if (ytVidId(url) !== false) {
        $('#ytlInfo').addClass('fieldok');
    } else {
        $('#ytlInfo').removeClass('fieldok');
    }
});

演示

于 2012-09-16T13:13:47.643 回答
0

我使用上述方法创建了一个方法

$(document).ready(function(){

    $.validator.addMethod("youtube", function(value, element) {
     var p = /^(?:https?:\/\/)?(?:www\.)?youtube\.com\/watch\?(?=.*v=((\w|-){11}))(?:\S+)?$/;
     return (value.match(p)) ? RegExp.$1 : false;
    }, "Enter correct URL");

    var validator = $("#frmAddvideo").validate({
        errorElement:'div',
        rules: {
            useravideo: {
                required: true,
                youtube: "#useravideo"
            }

        },
        messages: {
            useravideo: {
                required: "Enter user A video URL",
            }
        }
    });
});
于 2013-02-04T06:50:33.543 回答