Question

我已经以静态方式完成了这项功能但是如何使用jquery进行滚动，以便它可以平滑地滚动到我动态添加的id的特定元素。

＆＃13;

var data = [{"name": "Aruba", "code": "A"},{"name": "AndorrA", "code": "A"},{"name": "Bhutan", "code": "B"},{"name": "Bolivia", "code": "B"}]
var num=0;
$.each(data, function(key, val) {
    if (!$("#aZContent ul." + val.code).is("*")) {
	    $("<ul />", {"class": val.code,"html": "<li>"+ val.name + "</li>"}).appendTo("#aZContent").before('<b class=' + val.code + ' id="letter_' + num++ + '">' + val.code + '</a></b>');
	} else {
		$("b." + val.code).each(function() {
		    if (this.textContent === val.code) {
				$(this).next("ul").append("<li>" + val.name + "</li>");
			}
	    });
	}
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="alphabet" id="alphaTab">
	<a href="#letter_0">A</a>
	<a href="#letter_1">B</a>	
</div>		
<div id="aZContent">
	<ul></ul>
</div>
<div style="height:500px"></div>

＆＃13;

点击链接＆＃39; A＆＃39;它应滚动到＆＃34; A＆＃34;同样

Answer 1

在我的应用程序中，我有一个按钮，每次单击按钮时都会将表单字段集附加到正文 - 我想将页面向下滚动到新元素，但由于冒泡和事件而无法正常工作jQuery的滚动功能的绑定限制。我提出了一个简单的解决办法......

function scroll(pixels){
    $('html, body').animate({
        scrollTop: pixels
    }, 1000);
};

function addObservation(x){
    $('body').append(x);
    newFieldSet = $('fieldset').last();
    pixelsFromTop = newFieldSet.offset().top;
    scroll(pixelsFromTop);
};

$(document).on("click", "#add_observation", function(){
    addObservation("<fieldset>SOME FORM FIELDS HERE</fieldset>");
});

因此，每次添加字段集时，jQuery都会找到最后一个字段集，然后.offset().top测量字段集从顶部开始的像素数，然后平滑地滚动距离的窗口。

Answer 2

我没有得到你的申请。但它应该很简单。

你说id是＆＃34; dynamic＆＃34;，这意味着会有动态生成的元素和相应的按钮/链接。

现在您需要做的就是......

我们可以说链接的密度是.linksy。

jQuery(".linksy").on('click', function(){
  e.preventDefault();
  $id = jQuery(this).attr('href');
  $('body').scrollTo('#' + $id);
});

如何使用jquery

2 个答案: