首先，我是Javascript和Regex的新手。在过去的一个月里，我一直在摸索。我一直在尝试将url粘贴到文本输入中，然后自动将其修剪为主机名，并在按下按钮之前对其进行验证。
我已经让它工作了好几次，但我一直遇到同样的问题：一段时间后，它就停止工作了。
我已经对代码进行了几次重新格式化和清理(不过，我确信它仍然很草率，因为我是新手(，我可以让它重新工作。但工作一个小时左右后，它就停止工作了。重新加载页面没有什么区别。即使重新启动我的电脑也没什么区别。它只是停止工作。
我唯一的猜测是，我处理这件事的方式一定有什么原因，导致它崩溃或停滞。也许是格式问题，也许方法论完全有缺陷。我只是知道的还不足以诊断它。
希望你们中的一些好人能够指出我的缺点，或者为我指明如何解决这个问题的正确方向。我已经搜索过了，但我找不到任何人试图在一个构建中完成我正在做的所有事情(准备在这里被证明是错误的(。
这是代码：
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>
<body>
<input id="notesUrlInput" type="text" placeholder="URL Goes here" pattern="^(?!www.)[a-zA-Z0-9-]+.[a-zA-Z0-9]+$" autocomplete="off">
<button id="notesExecuteButton" disabled>Execute</button>
<span id="notesUrlOutput"></span>
<!------------------------------------------------------------------------------->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script>
(function () {
var timeout = null;
var notesUrlOutput = document.getElementById("notesUrlOutput");
var notesExecuteButton = document.getElementById("notesExecuteButton");
document.getElementById('notesUrlInput').addEventListener('keyup',
function (e) {
clearTimeout(timeout);
timeout = setTimeout(
function () {
rawInput = $('#notesUrlInput').val();
cleanInput = rawInput.replace('www.', '');
cleanInput = cleanInput.replace('http://', '');
cleanInput = cleanInput.replace('https://', '');
cleanInput = cleanInput.replace(//.*/,'');
$('#notesUrlInput').val(cleanInput);
if (cleanInput.value == "") {
notesUrlOutput.innerHTML = "";
notesExecuteButton.disabled = true; return false;
} else if(!notesUrlInput.checkValidity()) {
notesUrlOutput.innerHTML = "Invalid URL: Please provide a valid URL";
notesExecuteButton.disabled = true; return false;
} else {
notesUrlOutput.innerHTML = "Input OK";
notesExecuteButton.disabled = false; return false;
}
}, 400);
});
})();
</script>
</body>
</html>令人沮丧的是，当我把这个代码粘贴到这里并运行它时，它成功了。我一打开文件就在浏览器中复制了它。它停止工作。我就是不明白。
从您的代码中，您似乎只想从输入字段中提取域名。
您可以混合使用JavaScriptDOM调用和jQuery，这很好。只使用jQuery通常更容易与DOM交互。以下是您在jQuery中重写的代码：
const cleanRegex = /^https?://(?:www.)?(.*)/.*$/;
const validRegex = /^[w-]+(.[w]+)+$/;
(function () {
$('#notesExecuteButton').prop('disabled', true);
$('#notesUrlInput').on('input', function(event) {
let val = $(this).val();
let cleaned = val.replace(cleanRegex, '$1');
$(this).val(cleaned);
if(!cleaned) {
$('#notesUrlOutput').text('');
$('#notesExecuteButton').prop('disabled', true);
} else if(!cleaned.match(validRegex)) {
$('#notesUrlOutput').text('Invalid URL: Please provide a valid URL');
$('#notesExecuteButton').prop('disabled', true);
} else {
$('#notesUrlOutput').text('Input OK');
$('#notesExecuteButton').prop('disabled', false);
}
});
})();<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<input id="notesUrlInput" />
<button id="notesExecuteButton" style="disabled: disabled;">Go</button>
<div id="notesUrlOutput"></div>说明：
.on('input')-每次输入字段中发生更改时都会触发-val.replace(cleanRegex, '$1')-清除：剥离协议和www前缀，以及URL路径(域后的任何文本cleaned.match(validRegex)-检查域的有效性.prop('disabled', true/false)-添加/删除禁用属性