Question

你好我有一个html页面使用for循环生成div id我怎么想用循环生成的id重新加载特定的div，这里是我的html代码

    {% for list in metrics_stats['metrics_list'] %}
            <div class="chart-row row" id="{{list[0]}}_parent metrics">

                <div class="chart-user col-sm-3" id="{{list[0]}}_user">
                    <div class="col-sm-12">
                        <h4 class="chart-title " id="{{list[8]}}_title">
                             <form>Per User: &nbsp; 
                                <select class = "action-btn " id="inputDays">
                                    <option value="{{list[8]}}">120 days</option>
                                    <option value="{{list[7]}}">60 days</option>
                                </select>
                                <br><br>
                                <noscript><input type="submit" value="Submit"></noscript>
                            </form>
                            <p id="daysInputForm"></p>
                        </h4>
                    </div>
                    <div class="col-sm-12">
                        <div class="chart chart-pie" id="{{list[8]}}"></div>
                    </div>
                </div>
            </div>
    {% endfor %}

因此，每当用户选择值为60的选项时，其下方的div为id =＆＃34; {{list [8]}}＆＃34;应该重新加载如何实现这一点，而无需重新加载整个页面感谢

Answer 1

我的设计模式是使用类来标记元素的功能。在您的情况下，我不是使用id = {{list [8]}}，而是使用class =＆＃34; chart chart-pie js-chart＆＃34;来识别图表。然后，当select选项更改时，我会使用相对dom关系来查找此类。我的命名约定是用$前缀启动jquery dom元素，所以我知道我也不需要将它们包装在$（var）中。

所以我的jquery看起来像：

$('.action-btn').change(function(e) {
  var $pdiv = $(this).parents('.chart-user');
  var $chart = $pdiv.find('.js-chart');
  .. use chart now to do your reload behavior here
});

由于我不太清楚重新加载图表div需要什么，我很乐意在您提供更多信息时对其进行编辑。

获取使用for循环生成的元素id并重新加载该div

1 个答案: