Javascript jQuery.val（）未设置<；的值；选择>；

我想知道为什么jQuery的

.val（）

函数在我调用replaceWith后没有为我设置

控件的值，但它在其他方面起作用

求你了

ABCDEF
函数ControlOff（）{
$（'select'）。每个（函数（）{
$（this.replacetwith（“”+$（this.val（）+“”）；
});
}
函数ControlOn（）{
$（'.select type'）。每个（函数（）{
所选变量=$（this）.text（）；
$（this）.替换为（'ABCDEF'）；
$（此）.val（选定）；
});
}
功能测试（）{
$（'select'）.val（'DEF'）；
}

问题是在

控制中，每个
都有一个
循环
。选择类型
元素是
span
，不能使用
val
方法设置跨度：

您可以通过将方法更改为以下方式解决此问题：

function ControlOn() {
    $('.select-type').each(function () {
        var selected = $(this).text();
        var $select = $('<select><option>ABC</option><option>DEF</option></select>');
        $(this).replaceWith($select)
        $select.val(selected);
    });
}

函数控制（）{
$（'.select type'）。每个（函数（）{
所选变量=$（this）.text（）；
变量$select=$（'ABCDEF'）；
$（此）.replaceWith（$select）
$select.val（已选）；
});
}

实例：
设置选项值将解决您的问题

ABCDEF
问题是，
$（this）
中的
$（this）
。val（selected）
指的是删除的
元素，而不是您的新元素。您需要将其替换为：

$('select').val(selected);

获取先前插入的新元素

此外，您的代码非常复杂，这与此相同，但更简单：

function ControlOn() {
    $selectText = $('.select-type');
    var selected = $selectText.text();
    $selectText.replaceWith('<select><option>ABC</option><option>DEF</option></select>');
    $('select').val(selected); // Use an id instead to match: #my-select-id
}

函数控制（）{
$selectText=$（'.select type'）；
var selected=$selectText.text（）；
$selectText.replacetwith（'ABCDEF'）；
$（'select'）.val（selected）；//改为使用id来匹配：#我的选择id
}

一定要给
元素一个ID，否则一旦你在页面的其他地方引入了一个新的
元素，它就会出错

我建议您使用“disabled”属性打开和关闭select，它不会破坏.val（）功能

function ControlOff() {
    $("select").attr("disabled", "disabled");
}

function ControlOn() {
    $("select").removeAttr("disabled");
}

函数控制（）{
$（'.select type'）。每个（函数（）{
所选变量=$（this）.text（）；
$（this.replace为（$（'ABCDEF'）.val（选中））；
});
}

像上面那样重写你的代码，它会工作的

this
引用的元素不会更改为您刚才创建的select元素，它将始终是该函数范围内的
span
元素。因此，您应该将该值设置为新创建的
select
，而不是不变的
$（this）
 
但是把我的问题提交给jsFiddle行吗？
-不仅行，而且非常糟糕！它在Chrome中对我有效。我相信您会想要设置
选项
项的
值
参数，尽管在设置值时类似于
abc
+1。此外，它在FF15.0.1No中工作。它在我最新的FF和最新的Chrome上不起作用。尝试将下拉列表设置为DEF，然后单击“控制关闭”，然后单击“控制打开”。虽然这应该会将select设置为DEF，但它不会。它也适用于我（chrome 22）。这很好，但我正在设置$（这个），而不是所有的
。想想看，当我有多个具有不同值的
时，我无法使用您的代码。我的问题是，$（这个）已经被
取代了，现在，$（这个）不是
？当然，
必须设置val。@user1589188-我完全明白你的意思，这是我的错，因为你在示例的其他地方使用了范围较广的
$（'select'）
选择器。我再看看。非常感谢你！这就是方法！因此，在调用replaceWith之后，$（this）确实没有被更新。奇怪的您可以看到，如果调用
alert（$（this）.text（））
即使在调用replaceWith之后，您仍然可以在span中获得文本！！！不，没有。尝试将下拉列表设置为DEF，然后单击“控制关闭”，然后单击“控制打开”。您没有看到“选择定义”下拉列表，否？这与此无关，如果省略了
值
属性，则该值继承自文本。@Jamiec如果值和文本不同怎么办？在这种情况下，你的建议将失败。但是，至关重要的是，在OP问题中，它们是相同的。谢谢，但这不是我想要实现的。你想要实现什么？因为将带有标签的标签放在里面是一种无稽之谈（只能包含和标签），而且在不同的浏览器上可能会有不同的行为。No，我使用replaceWith将
替换为
，而不是在
里面添加
，对不起，我的错。我一定是累了或是什么：-）。感谢您的输入和+1指出$（这）在调用replaceWith后没有更新到新控件。但我的代码并不复杂，因为这是一个以上的
。同样，您的代码不是针对多个
通用的，而是仅当存在一个
@user1589188时才有效，当然，但您从未说过存在多个。但如果有，您将更改所有
s；）请提供更多的上下文（在你最初的问题中），这样我可以在我的代码中更好地反映你的情况。这与我的代码无关。正如我所说，我的代码是通用的，可以处理多个
。只需在HTML中添加更多的
，并且不要更改我的代码，您可以看到我的代码在所有这些代码上都能工作。我刚刚从HTML部分删除了多个
，只是为了使示例更小。不过还是谢谢你的意见。@user1589188我理解。我的意思是，它在问题中没有这样说，这就是为什么你必须期望一些人会向你指出简化。这只是为了给将来的问题提个建议；）是的，我明白你的意思。我将尝试进一步简化我的代码，或者下次清楚地说明它。这次我直接复制了我的代码，因为我担心我可能会
function ControlOn() {
    $selectText = $('.select-type');
    var selected = $selectText.text();
    $selectText.replaceWith('<select><option>ABC</option><option>DEF</option></select>');
    $('select').val(selected); // Use an id instead to match: #my-select-id
}

function ControlOff() {
    $("select").attr("disabled", "disabled");
}

function ControlOn() {
    $("select").removeAttr("disabled");
}

function ControlOn() {
    $('.select-type').each(function () {
        var selected = $(this).text();
        $(this).replaceWith($('<select><option>ABC</option><option>DEF</option></select>').val(selected));
    });
}