ie7和ie8 select使用jquery clone不兼容处理

浏览数：289 / 时间：2015年06月09日

本文解决方案基于http://blog.csdn.net/zzx3q/article/details/8017794

在ie7和ie8下，用jquery clone复制一个select，复制的select是本体的select初始化时的一个副本，无法复制目前本体select选择。

解决方案：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="./lib/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    //ie7和ie8兼容
    function testSelect() {
        var tr = $("#table").find("tr:eq(0)");
        var test = $("<tr></tr>");
        test.append(tr.html());
        $("#table").append(test);
    }
    
    //ie8以上兼容
    function testSecond() {
        var tr = $("#table").find("tr:eq(0)");
        $("#table").append(tr.get(0).outerHTML);
    }
    
    function teschange(obj) {
        $(obj).find("option:eq(3)").attr("selected",‘selected‘);
    }
    
    function testClone() {
        var tr = $("#table").find("tr:eq(0)");
        $("#table").append(tr.clone());
    }
</script>
</head>
<body>

    <table id="table">
        <tbody>
            <tr>
            <td>
            
                <table>
                    <tbody>
                        <tr>
                            <td><select onchange="teschange(this)">
                        <option value="volvo">Volvo</option>
                        <option value="saab" selected=‘selected‘>Saab</option>
                        <option value="opel">Opel</option>
                        <option value="audi">Audi</option>
                </select></td>
                        </tr>
                    </tbody>
                </table>
                </td>
            </tr>
        </tbody>
    </table>

    <input type="button" value="测试复制" onclick="testSelect()"></input>
    <input type="button" value="测试第二种复制" onclick="testSecond()"></input>
    <input type="button" value="jquery clone" onclick="testClone()"></input>
</body>
</html>