Question

我有一个用于嵌入代码的youtube输入，我希望也能使用户不必输入一个youtube嵌入。但是我对如何更改我的正则表达式以接受一个空字段感到困惑...如果用户未通过正则表达式，则设置了错误；如果用户通过了正则表达式，则设置了错误，因此，我想将有一个简单的解决方案正则表达式接受一个空的输入值。

有人可以从下面的代码中看到我将如何实现这一目标...

谢谢您的建议。

function checkyoutube() {


var youtube = $("#youtubevalue").val();


//var youtubeReg =/^[a-zA-Z][a-zA-Z0-9-+&%#=?<>()£~_\.*@$!, \r\n]{0,300}$/;
  var youtubeReg =/^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((.|-){11})(?:\S+)?$/;

    if(!youtubeReg.test(youtube)) { localStorage.setItem('error', 'true');
        $("#youtubefooter").text("Example https://youtu.be/12KxXnFbwbU"), $( "#youtubevalue" ).addClass( "errorclass" ), $( "#youtubevalue" ).removeClass( "noerrorclass");
                    }  

    if(youtubeReg.test(youtube)) { localStorage.setItem('error', 'false');
        $("#youtubefooter").text("URL Is Good, Thanks!"), $( "#youtubevalue" ).addClass( "noerrorclass" ), $( "#youtubevalue" ).removeClass( "errorclass");
                    } 



var youtubeB = document.getElementById('youtubevalue');

(var regex= LOTS / OF / BAD / WORDS;)'EDITED FOR STACK'
youtubeB.value=youtubeB.value.replace(regex, "****");   


};

Answer 1

您可以通过使用非捕获组? ..... (?:

将正则表达式设为)?可选

^(?:(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((.|-){11})(?:\S+)?)?$

var youtubeReg = /^(?:(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((.|-){11})(?:\S+)?)?$/;
var strings = [
  'https://youtu.be/12KxXnFbwbU',
  '',
  'https://youtu'
];
strings.forEach((s) => {
  console.log(s + ' ==> ' + youtubeReg.test(s));
});

Answer 2

使用正则表达式必须完成吗？如果不是，则可以简单地修剪输入并检查其是否为空，如果为空，则为好，如果不应用正则表达式。

请参见下面的代码

function checkyoutube() {

var youtubeReg =/^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((.|-){11})(?:\S+)?$/;

var youtube = $("#youtubevalue").val();
 //checking for length here after trimming 
if(youtube.trim().length==0||youtubeReg.test(youtube)) { localStorage.setItem('error', 'false');
    $("#youtubefooter").text("URL Is Good, Thanks!"), $( "#youtubevalue" ).addClass( "noerrorclass" ), $( "#youtubevalue" ).removeClass( "errorclass");
                } 
else{//skipped testing for regex again here
localStorage.setItem('error', 'true');
    $("#youtubefooter").text("Example https://youtu.be/12KxXnFbwbU"), $( "#youtubevalue" ).addClass( "errorclass" ), $( "#youtubevalue" ).removeClass( "noerrorclass");
}




var youtubeB = document.getElementById('youtubevalue');

(var regex= LOTS / OF / BAD / WORDS;)'EDITED FOR STACK'
youtubeB.value=youtubeB.value.replace(regex, "****");   


};

JS YouTube正则表达式，输入为空

2 个答案: