簡體   English   中英

javascript-正則表達式僅驗證特定網址

[英]javascript- regex to validate only specific urls

我正在創建一個reg exp,僅用於驗證參數p的值介於100到9999之間的列表中的那些URL。因此,從下面給出的列表中,當第三個和第四個URL輸入到一個URL中時,它們都需要返回true作為輸出。文本框。

http://www.website.com/our-resources/news/?p=1
http://www.website.com/example/voice-of-the-customer/news/?p=12
http://www.website.com/our-resources/news/?p=123
http://www.website.com/example/?p=4321
http://www.website.com/example/products/touchchat/news/?p=12345

HTML

<input type=url/>
<button>Validate</button>
<div id=status></div>

使用Javascript

$('button').click(function(){
    var val = $('input').val();
    var regex = /^(https?:\/\/)?[a-z0-9-]*\.?[a-z0-9-]+\.[a-z0-9-]+(\/[^<>]*)?$/;
    var isValid = regex.test(val);
    $('#status').text(isValid);
});

但是此正則表達式對所有URL返回true。 我應該對此表達式做哪些更改?

小提琴

一個更簡單的解決方案是從URL檢索querystring參數,然后檢查其值是否符合您的界限:

 $('button').click(function() { var p = parseInt(getParameterByName('p', $('input').val()), 10) || 0; var isValid = p >= 100 && p <= 9999; $('#status').text(isValid); }); function getParameterByName(name, url) { if (!url) url = window.location.href; name = name.replace(/[\\[\\]]/g, "\\\\$&"); var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), results = regex.exec(url); if (!results) return null; if (!results[2]) return ''; return decodeURIComponent(results[2].replace(/\\+/g, " ")); } 
 body { font: 10pt Verdana; } input { width: 100%; display: block; margin-bottom: 1em; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="url" value="http://google.com/" /> <button>Validate</button> <div id="status"></div> 

您可以使用網址

var fnGetURL = ( strURL ) => {
   try
   {
      return new URL( strURL );
   }
   catch(e)
   {
      return null;
   }
};

如果未返回null則獲取searchParams

var fnIsValidURL = ( strURL ) => {
   var url = fnGetURL( strURL );
   if ( url )
   {
      var p = +url.searchParams.get("p");
      return p >= 100 && p <= 9999;
   }
   return false;
};

演示

 var fnGetURL = (strURL) => { try { return new URL(strURL); } catch (e) { return null; } }; var fnIsValidURL = (strURL) => { var url = fnGetURL(strURL); if (url) { var p = +url.searchParams.get("p"); return p >= 100 && p <= 9999; } return false; }; var urlArr = ["http://www.website.com/our-resources/news/?p=1", "http://www.website.com/example/voice-of-the-customer/news/?p=12", "http://www.website.com/our-resources/news/?p=123", "http://www.website.com/example/?p=4321", "http://www.website.com/example/products/touchchat/news/?p=12345"]; urlArr.forEach( function(url){ console.log( url, fnIsValidURL(url) ); }); 

試試看:

function isValidParam(url) {
    if ($.urlParam('p',url) > 99 && $.urlParam('p',url)<10000) {
        return true;
    }
    return false;
}

調用上述方法檢查URL的有效性

$.urlParam = function(name,url) {
    var results = new RegExp('[\\?&]' + name + '=([^&#]*)')
            .exec(url);
    if (results == null) {
        return null;
    } else {
        return results[1] || 0;
    }
};

可能太簡單了,但是我發現此正則表達式可以很好地滿足您的需求。

/(?:http://[\S]*)\/\?p=(\d{3,4})$/g

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM