jquery - JQuery 用原始内容替换 div

Question

我有一个下拉列表，它调用不同的操作，如下所示：

$('#Select').change(function () {
            var n = $(this).val();
            switch (n) {
                case '1':
                    // Action
                    break;
                case '2':
                    //Action
                    break;
                case '3':
                    //Action
                    break
            }
        });

我希望能够实现的是每次用户在下拉框中选择不同的选项时清除插入到结果 div 中的任何内容。

我有一个容器，其中显示了由于下拉选择而调用的所有内容，我想在加载页面时将其恢复为原始状态。我努力了：

var divClone = $('#Everything').clone();
        $('#Select').change(function () {
            $('#Everything').replaceWith(divClone);
            var n = $(this).val();
            switch (n) {
                case '1':
                    // Action
                    break;
                case '2':
                    // Action
                    break;
                case '3':
                    // Action
                    break;
                case 'Select a Call Type':

                    break
            }
        });

但没有运气。

有什么建议么？

提前致谢。

Answer 1

您没有看到任何更改，因为您正在替换#Everything为自身的克隆。净效果是没有变化。

相反，您可以使用html函数来设置#Everythingdiv 的内容：

var everything = $('#Everything');
$('#Select').change(function () {
    var n = $(this).val();
    switch (n) {
        case '1':
            everything.html("Hello from 1");
            break;
        case '2':
            everything.html("Hello from 2");
            break;
        case '3':
            everything.html("Hello from 3");
            break
    }
});

工作小提琴