JQuery .val() 在 Internet Explorer 中不起作用答案

【问题标题】：JQuery .val() doesn't work in Internet ExplorerJQuery .val() 在 Internet Explorer 中不起作用
【发布时间】：2017-06-23 19:14:04
【问题描述】：

$('.dual_select').val();这不起作用并在 Internet Explorer 上返回空。有什么想法吗？

var self = this;
        var selectedOptions = $('.dual_select').val();
        for (i = 0; i < selectedOptions.length; i++) {
            self.membersToSave[i] = JSON.parse(selectedOptions[i]);
        }
        $.ajax({
            type: "PUT",
            url: teamUrl + '/' + self.team.id + '/teamMember',
            data: JSON.stringify(self.membersToSave),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                router.push('/');
            },
            failure: function (errMsg) {
                alert(errMsg);
            },
            beforeSend: function () { $(".loading").show(); },
            complete: function () { $(".loading").hide(); },
        });

【问题讨论】：

请发布您的 HTML。您期望什么价值？
我可以向你保证 val() 在 IE 中工作得非常好。你的代码一定有问题。您能否发布一个工作示例，包括任何 HTML/CSS，并检查控制台是否有错误。
你真的在使用 Vue 吗？您不应该直接操作 DOM。
我想提醒大家，这段代码只是在特定环境下才有问题。 (IE)

标签： jquery internet-explorer bootstrap-duallistbox

【解决方案1】：

Vue 代码：

`var MemberEdit` = Vue.extend({
template: '#member-edit',
data: function () {
    return {
        team: '',
        teamMemberList: [],
        noMembers: [],
        membersToSave: []
    };
},
created: function () {
    this.fetchData();
},
mounted: function () {
    this.startDualList();
},
methods: {
    fetchData: function () {
        var self = this;
        $.get(teamUrl + "/" + self.$route.params.team_id, function (data) {
            self.team = data;
        });
        $.get(noMembersUrl, function (data) {
            self.noMembers = data;
            return data;
        });
        $.get(teamUrl + "/" + self.team.id + "/teamMember", function (data) {
            self.teamMemberList = data;
        });
    },
    updateMember: function () {
        var self = this;
        var selectedOptions = $('.dual_select').val();
        for (i = 0; i < selectedOptions.length; i++) {
            self.membersToSave[i] = JSON.parse(selectedOptions[i]);
        }
        $.ajax({
            type: "PUT",
            url: teamUrl + '/' + self.team.id + '/teamMember',
            data: JSON.stringify(self.membersToSave),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                router.push('/');
            },
            error: function (errMsg) {
                alert(errMsg);
            },
            beforeSend: function () { $(".loading").show(); },
            complete: function () { $(".loading").hide(); },
        });
    },
    startDualList: function () {
        startDual();
    }
},
watch: {
    teamMemberList: function () {


    }
}

});

和jsp代码：

    <template id="member-edit">
    <section>
        <h4 class="label label-default pull-right"><i class="fa fa-user-plus"></i><CrmTagLib:CrmMsg key="teamManagement.label.addMember"/></h4>
        <div class="clearfix"></div>
          <form>
            <div class="alert alert-info"><CrmTagLib:CrmMsg key="teamManagement.alert.addMember.info" arg0='<strong>{{ team.name }}</strong>'/></div>
            <div class="clearfix"></div>
                <div class="form-group">
                    <select class="form-control dual_select" multiple>
                        <option v-for="noMember in noMembers" :value="JSON.stringify(noMember)">{{ noMember.name }}</option>
                        <option selected v-for="member in teamMemberList" :value="JSON.stringify(member)">{{ member.name }}</option>
                    </select>
                </div>
                <div class="btn-group btn-group-justified" role="group" aria-label="...">
                    <div class="btn-group" role="group">
                        <router-link class="btn btn-default" :to="{path: '/'}"><CrmTagLib:CrmMsg key="general.button.cancel"/></router-link>
                    </div>
                    <div class="btn-group" role="group">
                        <button v-on:click="updateMember" class="btn btn-info"><CrmTagLib:CrmMsg key="general.button.save"/></button>
                    </div>
                </div>
            </form>
    </section>
</template>

【讨论】：