0

選択ボックスのオプションからテキストを取得しています。次に、この文字列値を append() 関数に渡しますが、イメージ名を呼び出すために、文字列にハイフンを追加したいと思います。

HTML:

<select>
    <option>Demo Cars</option>
    <option>New Cars</option>
    <option>Used Cars</option>
    <option>Other</option>
</select>

var p = 'http://myurl.com/images/';
$('select').eq(0).on('change',function(){
    $('#productQuote').empty();
    var j = $(this).children(':selected').val(); 
    $('#productQuote').append('<img src="'+ p + j + '.jpg' '" />');
});

例えば：

最初の選択オプションを選択すると、文字列は "Demo Cars" となり、j == "Demo Cars" となります。

しかし、今はそのイメージを呼び出したいのですが、イメージ名にスペースを含めることはできません。 では、ここで疑問が生じます。Demo と Cars の間にハイフンを追加するにはどうすればよいでしょうか?

4

5 に答える 5

2

replace() メソッドを使用します。

var j = ...
j = j.replace(" ", "-");

MDN ドキュメント

于 2013-04-29T12:33:55.127 に答える
1

メソッドを使用しreplace()ます。グローバル フラグを設定して正規表現を使用すると、複数のスペースがある場合でも、文字列内のすべてのスペースがハイフンに置き換えられます。

var j = $(this).children(':selected').val().replace(/ /g, '-');
于 2013-04-29T12:34:04.660 に答える
1

これを行うには多くの簡単な方法があり、それぞれの目的が異なる場合があります。すでに使用可能なコードの多くに影響を与えることなく、これを「インライン」で行う簡単な方法をいくつか紹介します。

.replace ()を使用(マイナス面は、複数の空白がある場合、それらすべてが置き換えられないことです。これは、以下に示すように、正規表現または分割結合で修正できます)

 $('#productQuote').append('<img src="'+ p + j.replace(" ", "-") + '.jpg" />');

すべてのスタイルを置換:

$('#productQuote').append('<img src="'+ p + j.replace(/ /g, "-") + '.jpg" />');

.split().join()のチームと

$('#productQuote').append('<img src="'+ p + j.split(" ").join("-") + '.jpg" />');
于 2013-04-29T12:34:39.920 に答える
0

http://jsfiddle.net/2dJAN/6/を参照してください 。

<div class="btn-post">button text</div>
<div id='test'> </div>


$(document).ready(function(){
 $('#test').html($('.btn-post').text().replace(" ", "-"));
});

これがあなたの要求を達成するのに役立つことを願っています.

于 2013-04-29T12:37:46.877 に答える