从作为 ajax 响应加载到 div 的页面中删除 html 元素答案

【问题标题】：Remove html element from a page loaded as ajax response into div从作为 ajax 响应加载到 div 的页面中删除 html 元素
【发布时间】：2015-09-19 12:54:06
【问题描述】：

一旦我的 index.jsp 页面作为单击 regdata.jsp 页面上的登录按钮的响应加载，我正在尝试使用 id=regbutton 删除链接（我想将其设为按钮，请也提供帮助）

regdata.jsp

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#mainDiv").load("index.jsp");
        $('#regButton').remove();
    });
});
</script>
</head>
<body>
<div id="mainDiv" class="units-row">
<h2>Thanks For registering!</h2>
<button id="regLogin">Login Now</button>
</div>

index.jsp

<body>
       <center>
         <s:actionerror />
         <h1 id="login_title"></h1>
         <form action="checkLogin.action" method="post">
            <p>
               <input type="text" id="username" name="username" 
                  placeholder="" >
            </p>
            <p>
               <input type="password" name="password" 
                  placeholder="" id="password">
            </p>
            <label> <input type="checkbox" name="remember_me" id="remember"><label for="remember" id="rememberlbl"></label></label>
            </p>
            <input type="submit" class="btn-log" method="execute"
               key="label_login"> &nbsp;&nbsp;
         </form>
         <a href="registerLogin.action" id="regButton">Register</a>         
      </center>
   </body>

【问题讨论】：

在 ('#regButton') 之前缺少 $
试过还是不行

标签： javascript jquery html ajax jsp

【解决方案1】：

jQuery 的load 函数接受第二个或第三个参数——加载完成时执行的回调函数。因此，如果您希望按钮仅在加载完成时消失，您应该将您的代码移动到该处理程序中：

$(document).ready(function(){
    $("button").click(function(){
        $("#mainDiv").load("index.jsp", function() {
          $('#regButton').remove();
        });
    });
});

【讨论】：

谢谢！由于声誉较低，我无法为您的 cmets 投票，因此效果很好
点击提交按钮后，我又面临一个问题，下拉列表（用于国际化）再次加载到我的页面上，即我有两个相同下拉列表的实例，其中一个是static 即不执行任何操作
您可能需要使用 jQuery 的 .on() 函数来将事件附加到可能尚不存在的元素。 IE。 $(window).on("click", "button", function() { .... }); 这样代码将在所有按钮元素上执行，即使它们是动态添加的。 api.jquery.com/on

【解决方案2】：

我可以看到一个简单的解决方案

#regButton
{
 display:none;
}

如果这还不够，我也在研究 jquery 解决方案

【讨论】：