Question

我可以做上面提到的，但是因为我是jquery的新手，我想知道是否有人能告诉我更高效的＆＃39;解决问题。

基本上，当点击一个收音机时，它会显示并滚动到一个div。

$("input:radio[name='one']").click(function() {      
  $('table.one').fadeIn(800); 
  $('html, body').animate({scrollTop:$('table.one').position().top}, 'slow');
});

$("input:radio[name='two']").click(function() {      
  $('table.two').fadeIn(800); 
  $('html, body').animate({scrollTop:$('table.two').position().top}, 'slow');
});

$("input:radio[name='three']").click(function() {      
  $('table.three').fadeIn(800); 
  $('html, body').animate({scrollTop:$('table.three').position().top}, 'slow');
});

<table class="one" style="display: none;"> ...

我已经使用了相同的脚本三次，编写脚本的最佳方法是什么？非常感谢： - ）

Answer 1

您可以通过为已经点击的输入获取目标表来为代码干燥，方法是为其提供数据属性，例如<input type='radio' data-table='one' />

$("input:radio").click(function() {   
  var table = 'table.' + $(this).attr('data-table');   
  $('' + table).fadeIn(800); 
  $('html, body').animate({scrollTop:$('' + table).position().top}, 'slow');
});

您可以通过其他几种方式获取表格，例如类。

单击滚动并显示div - jquery

1 个答案: