如何访问通过 HTML jquery 函数添加的 DIV？答案

【问题标题】：How to access DIV that was added via HTML jquery function?如何访问通过 HTML jquery 函数添加的 DIV？
【发布时间】：2017-08-29 04:40:40
【问题描述】：

我有一个通过 jquery 单击按钮提交的表单。当表单运行时，它会在#results 中放置一些自定义html，如下所示：

$('#run-scraper').click(function() {

    $('#scraper-form').submit();

    $('#results').html('<div class="loading">Scraping odds. Please wait...<br><img src="/images/ajax-loader.gif">');

});

我在下面使用 jquery-form-validation。我想要做的是清除错误的结果 div。但它不工作。 HTML 出错时会保留在那里。单击按钮时添加后如何访问结果？

$.validate({
    form                    :   '#scraper-form',
    errorMessagePosition    :   'top',
    validateOnBlur          :   false,
    scrollToTopOnError      :   false,
    onError                 :   function($form) {

        $('#results').html('');

    }
});

【问题讨论】：

标签： jquery validation jquery-form-validator

【解决方案1】：

像下面这样使用

$('#run-scraper').click(function() {
    $('#results').html('<div class="loading">Scraping odds. Please wait...<br><img src="/images/ajax-loader.gif">');
    $('#scraper-form').submit();
});

【讨论】：

哇更多证明我还有很长的路要走。谢谢！

【解决方案2】：

你来看看解决方案。

$.validate({
    form                    :   '#scraper-form',
    errorMessagePosition    :   'top',
    validateOnBlur          :   false,
    scrollToTopOnError      :   false,
    onError                 :   function($form) {
      $('div[class="loading"]).remove();
    }
});

下面的代码有无效的HTML

$('#results').html('<div class="loading">Scraping odds. Please wait...<br><img src="/images/ajax-loader.gif">');

改成

$('#results').html('<div class="loading">Scraping odds. Please wait...<br><img src="/images/ajax-loader.gif"></div>');

另一种方法使用jQuery empty 方法清空#result 容器。

$.validate({
    form                    :   '#scraper-form',
    errorMessagePosition    :   'top',
    validateOnBlur          :   false,
    scrollToTopOnError      :   false,
    onError                 :   function($form) {
      $('#results').empty();
    }
});

希望这会对你有所帮助。

【讨论】：