Question

我有一个像这样的jQuery代码：

$names .= "<tr>
            <td>".$result['names']."</td>
            <td>Test</td>
            </tr>";

现在的问题是如果$('#dataset_list').append("<option value="+data[i]['fields']['name']+">"+data[i]['fields']['name']+"</option>")包含一个空格。
例如data[i]['fields']['name']
它只会将data[i]['fields']['name'] = "big city"放在值属性中。

我知道我可以限制用户不要输入空间。但有什么方法可以解决这个问题吗？

Answer 1

将值包含在引号内，否则空格后的值将作为新属性。

$('#dataset_list').append("<option value='"+data[i]['fields']['name']+"'>"+data[i]['fields']['name']+"</option>")
//                                     --^--                         --^--

或者您可以生成DOM element using jQuery，然后使用appendTo()方法附加。

$('<option/>', {
  text: data[i]['fields']['name'],
  value: data[i]['fields']['name']
}).appendTo('#dataset_list');

Answer 2

我认为，以下将是一种更安全和更清洁的方法（为了清晰起见，添加了评论）：

// create an 'option' element on the fly and assign it to variable $opt
var $opt = $('<option/>');  

// this goes to value attribute for option
$opt.val(data[i]['fields']['name']);  

// this is display text for option
$opt.text(data[i]['fields']['name']); 

// now, append the new element to your #data_list element
$('#dataset_list').append($opt);

jQuery - append（）方法因空间不正常

2 个答案: