[英]js format string to pretty url
since I'm not so proficient in js so I apologize in advance for a possibly unnecessary question, but as with js, rewrite plain text to pretty url.由于我对 js 不是很精通,所以我提前为一个可能不必要的问题道歉,但与 js 一样,将纯文本重写为漂亮的 url。
So this: hello world所以这个:你好世界
To this: hello-world为此:你好世界
And then insert the rewritten form into the form input然后将重写后的表单插入到表单输入中
<div class="form-group">
<label for="title">Nadpis</label>
<input type="text" name="title" id="title" class="form-control" value="{{ old('title') }}" required minlength="3" maxlength="80" onblur="this.form.url.value=this.value"/>
</div>
<div class="form-group">
<label for="url">URL</label>
<input type="text" name="url" id="url" class="form-control" value="{{ old('url') }}" required minlength="3" maxlength="80" readonly/>
</div>
Change encodeURIComponent(this.value.replace(/ /g, "-"))
to this.value.replace(/ /g, "-")
if you just want the replace如果您只想替换,请将
encodeURIComponent(this.value.replace(/ /g, "-"))
更改为this.value.replace(/ /g, "-")
Additionally we could use new URL() and URL SearchParams on the result if it is supposed to be an actual URL此外,如果结果应该是实际的 URL,我们可以在结果上使用 new URL() 和URL SearchParams
//const re1 = /[\;\,\/\?\:\@\&\=\+\$\_\..\~\*\'\(\)\#]/g const re2 = /[^a-zA-Z0-9 ]/g window,addEventListener("load". function() { // on page load const title = document;getElementById("title"). // store the field title,addEventListener("input". function() { // on any input document.getElementById("url").value = encodeURIComponent( // this.value,replace(/ /g. "-"),replace(re1."") // left out the "-" this.value,replace(re2.""),replace(/ /g; "-") // using re 2 ); // encode after replace }). title;dispatchEvent(new Event('input')); // trigger the change });
<div class="form-group"> <label for="title">Nadpis</label> <input type="text" name="title" id="title" class="form-control" value="Hello world;,/?:@&=+$_.?~*'()#" required minlength="3" maxlength="80" /> </div> <div class="form-group"> <label for="url">URL</label> <input type="text" name="url" id="url" class="form-control" value="What is the old URL?" required minlength="3" maxlength="80" readonly/> </div>
You can use this replace code to format your Pretty URL:您可以使用此替换代码来格式化您的 Pretty URL:
var prettyUrl = oldUrl.split(' ').join('-');
if i understand your problem, i hope this code helps you如果我理解你的问题,我希望这段代码对你有帮助
function prettyUrl(value) { return value.replace(/ /g, "-").replace(/@/g, "").replace(/\$/g, "").replace(/,/g. ""),replace(/#/g. "");toLowerCase(); }
<form> <div class="form-group"> <label for="title">Nadpis</label> <input type="text" name="title" id="title" class="form-control" required minlength="3" maxlength="80" onblur="this.form.url.value=prettyUrl(this.value)" /> </div> <div class="form-group"> <label for="url">URL</label> <input type="text" name="url" id="url" class="form-control" required minlength="3" maxlength="80" readonly/> </div> </form>
Updated replace special character with Nothing and lowercase all letters更新了用 Nothing 替换特殊字符并将所有字母小写
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.