ユーザーが入力を入力すると、動的にURLスラッグを作成しようとしています。不要な文字は削除する必要があります。スペースは、ハイフンとすべてを小文字に置き換える必要があります。したがって、ユーザーが「Ruddy's Cheese Shop」と入力すると、「ruddys-cheese-shop」が表示されます。jquery - 動的にURLを生成
これはこれまで私が行ってきたことです。
<input id="tb1" />
<div id="tb2"></div>
$('#tb1').keyup(function() {
var Text = $('#tb1').val();
Text = Text.toLowerCase();
Text = Text.replace(/[^a-zA-Z0-9]+/g,'-');
$('#tb2').html($('#tb1').val(Text));
});
これはほとんど動作しますが、私はjsに新しいです。ありがとう
コードは少し改善しました。
$('#tb1').keyup(function() {
var text = $(this).val().toLowerCase();
text = text.replace(/[^a-z0-9]+/g, '-');
$('#tb2').text(text);
});
あなたが$(this)として関数内それにrefferenceを持っているので、何度も何度も$('#tb1')要素を検索する必要はありません。
＃tb2の値を設定する場所以外はOKです。私はあなたが欲しいと思います：
$('#tb2').html(Text);
もちろん、あなたはtoLowerCaseを呼び出したので、大文字の文字を置き換える必要はありません。むしろより単純な正規表現：
Text = Text.replace(/[^a-z0-9]+/g,'-');
編集フィールドをユーザータイプとして更新する場合は、完全な例があります。入力を開始すると＃td2だけが更新されることに注意してください。
<html>
<head>
<script src="js/jquery.js" ></script>
<script language="javascript">
$(function() {
$('#tb1').keyup(function() {
var Text = $('#tb1').val();
Text = Text.toLowerCase();
Text = Text.replace(/[^a-z0-9]+/g,'-');
$('#tb2').html(Text);
$('#tb1').val(Text);
});
});
</script>
</head>
<body>
<input type="text" id="tb1" value="Ruddy's Cheese Shop" />
<div id="tb2"></div>
</body>
</html>
あなたは置き換えのカップルを実行する必要があるように見える
Text = Text.replace(/[\s]+/g,'-');
Text = Text.replace(/[^a-z_0-9\-]+/g,'');
をIE-チーズショップをruddysする血色のチーズショップを変換する
希望それ」
を助けることほとんど仕事... " - あなたはもっと具体的になりますか？ –
http://www.thewebsitetailor.com/jquery-slug-plugin/ – j08691