Question

我遇到了从XMLHttpRequest查询和粘贴的js exp / collapse菜单的问题。

问题是js exp / collapse菜单在与包含某些手机型号的菜单相同的页面上完美地工作，但是一旦我根据这些模型查询数据库项目并尝试通过XMLHttpRequest将它们粘贴到同一页面中但是，没有工作，模型的菜单确实存活。

让我感到困惑的是，当我访问XMLHttpRequest手动请求的页面时，它的工作原理应该是这样，似乎什么都没有。

有什么东西会破坏我的代码，因为我通过XMLHttpRequest函数请求它吗？

XMLHttpRequest函数

function showModel(str) {
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    }
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "getmodel.php?q=" + str, true);
    xmlhttp.send();
}

菜单的代码一旦粘贴了showModel函数就会中断（在SO上看起来很乱，对不起）：

这是我在页面上插入的测试，没有可能的数据库错误，但即使这个静态信息也完全混乱：

            <?PHP 
        echo '
        <div id="example3">
    <h4>
            Smartphones <a class="expand_all">
            <img src="images/expand.gif" alt="" /></a> 
            <a class="collapse_all"><img src="images/collapse.gif" alt="" /></a>
            </h4>
    <ul id="menu3" class="example_menu">
    <li><a class="expanded">Apple<img src="images/apple_collab.png" align="right"></a>
    <ul>        
    <li><a href="#TEST" value="TEST">TESTPRODUCT</a>
    <li><a href="#TEST" value="TEST">TESTPRODUCT</a>
    <li><a href="#TEST" value="TEST">TESTPRODUCT</a>
    </ul>
    </li>
    <li class="footer"><span> </span></li>
    </ul>
</div><br><br>';
?>

再一次，如果我手动访问getmodels.php它就像一个魅力，一旦我将showModel粘贴到包含此功能的页面上的div容器中它就会混乱，只显示标题（Apple）和菜单布局，折叠/展开功能不再工作，它不显示包含测试项目。

即使我把它设置为扩展，就像我在这里做的那样，以确保它们不被隐藏，但它们根本没有显示。

显然必须要做的事情是，它被这个函数粘贴，因为左侧导航菜单有精确的相同菜单，其中包含传递给getmodels.php的模型？q = model并且此列表继续即使在页面上发出请求并粘贴后也能正常工作。

是否有人可以解释为什么这可能会搞乱？

XMLHttpRequest打破了javascript函数

0 个答案: