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 回答
1

您不需要在 JavaScript 中执行此操作，因为它可以在标记中实现，标记具有您应该使用<option>的属性，因为这将任何逻辑和表示数据分开。value

例如，使用下面的标记将允许您照.val()原样使用该方法，但它会返回value而不是文本。

<select>
    <option value="demo-cars">Demo Cars</option>
    <option value="new-cars">New Cars</option>
    <option value="used-cars">Used Cars</option>
    <option value="other">Other</option>
</select>
于 2013-04-29T12:45:55.923 回答
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 回答