[解決済み] jQueryでTitleをURLスラッグに変換する方法とは?
2022-04-13 01:51:49
質問
CodeIgniterでアプリを作っているのですが、フォーム上のフィールドに動的に URLスラッグ . 句読点を削除し、小文字に変換し、スペースをハイフンに置き換えたいのです。例えば、Shane's Rib Shackは、shanes-rib-shackとなります。
今のところ、こんな感じです。小文字の部分は簡単でしたが、置換は全く機能していないようです。また、句読点を削除するアイデアもありません。
$("#Restaurant_Name").keyup(function() {
var Text = $(this).val();
Text = Text.toLowerCase();
Text = Text.replace('/\s/g','-');
$("#Restaurant_Slug").val(Text);
});
解決方法は?
スラッグ」という言葉がどこから来たのか、さっぱりわからないが、これでいいのだ。
function convertToSlug(Text) {
return Text.toLowerCase()
.replace(/ /g, '-')
.replace(/[^\w-]+/g, '');
}
最初の
replace
メソッドはスペースをハイフンに変更し、2番目のreplaceは英数字、アンダースコア、ハイフン以外を削除します。
もし、quot;のような - this" が "like---this" になるのが嫌なら、代わりにこっちを使えばいいんだ。
function convertToSlug(Text) {
return Text.toLowerCase()
.replace(/[^\w ]+/g, '')
.replace(/ +/g, '-');
}
これにより、1回目の置換ではハイフンが削除され(スペースは削除されない)、2回目の置換では連続したスペースが1つのハイフンに凝縮されます。
つまり、"like - this" は "like-this" と出力されるわけです。
関連
-
vueネットワークリクエストソリューション ネイティブネットワークリクエストとjsネットワークリクエストライブラリ
-
vueはopenlayersを使用してスカイマップとガオードマップをロードする
-
JavaScriptのgetElementById()メソッド入門
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] JavaScriptでメールアドレスを検証するのに最適な方法は何ですか?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
JavaScriptの関数この指摘の問題を説明
-
親子コンポーネント通信を解決する3つのVueスロット
-
jsを使った簡単な照明スイッチのコード
-
vue3.0プロジェクトのアーキテクチャを構築するための便利なツール
-
vueのプロジェクトでモックを使用する方法を知っていますか?
-
[解決済み】TypeError: Router.use() はミドルウェアの関数を要求しているが、Object を取得した。
-
Uncaught TypeError: null のプロパティ 'offsetHeight' を読み取れませんでした。
-
JavaScriptのgetElementById、getElementsByTagNam、getElementsByClassNameの違いと使い方
-
jq は html ページとデータを動的に分割する。
-
[解決済み】「ナメクジ」の語源は何ですか?[クローズド]。