Question

我有一个带有提交按钮的输入字段。当用户在该字段中输入任何网址并单击“提交”时，我必须检查

它是有效的网址和
我有一系列的域名，我必须检查输入的URL是否来自我已经拥有的域名。

这是我的HTML

<input type="text" id="product_url" placeholder="Enter product's full url">
<button type="button" id="validate_url">Validate URL</button>

这是我在jquery中拥有的域的数组

  var testCases  = ["corsair.com","oculus.com","rcplanet.com","irobot","store.hp.com"]

Answer 1

使用URL查看此代码

var testCases = ["amazon.com","corsair.com", "oculus.com", "rcplanet.com", "irobot", "store.hp.com"]
$(function() {
  $("#validate_url").on("click", function() {
    var found = "", val = $(this).prev().val();
    try {
      var url = new URL(val);
      $.each(testCases, function(_, part) {
        if (url.hostname.indexOf(part) != -1) {
          found=part;
          return false; // leave the loop
        }
      })
    } catch (e) {
      console.log(e.message)
    }
    if (found) console.log("found",found)
    else console.log(val,"not found")
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="product_url" placeholder="Enter product's full url">
<button type="button" id="validate_url">Validate URL</button>

Answer 2

使用此

function isUrlValid(url) {
  return /^(https?|s?ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900- \uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url);
}

$(document).ready(function() {
  $(document).on("click", "#ValidateURL", function() {
    var URL = $("#URL").val();
    var testCases = ["corsair.com", "oculus.com", "rcplanet.com", "irobot", "store.hp.com"]
    if (testCases.indexOf(URL) > -1) {
      if (isUrlValid('http://' + URL)) {
        console.log("URL found and valid URL");
      } else {
        console.log("URL found but invalid URL");
      }
    } else {
      console.log("URL not found");
    }
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="URL" />
<button id="ValidateURL">Validate URL</button>

jQuery从url获取域名并检查域名是否存在于我已经拥有的数组中

2 个答案: