Question

我有一张表格，我有iframe，我必须从另一家公司使用，我无法改变。我的访问者很难理解表单，我想添加说明，但这很难导致表单有不同的页面＆＃34;或步骤，我只想显示该段特定步骤的说明。

我知道这可能是一个很长的镜头，但下面是一个表格和我想要做的例子。

<!-- SHOW ONLY IF ID PAGE1 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- SHOW ONLY IF ID PAGE2 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- SHOW ONLY IF ID PAGE3 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- SHOW ONLY IF ID PAGE4 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- THIS IS THE FORM -->
<div class="form-name">
   <div class="current-page" ID="page1"> Page 1 questions </div>
   <div class="page" ID="page2"> Page 2 questions </div>
   <div class="page" ID="page3"> Page 3 questions </div>
   <div class="page" ID="page4"> Page 4 questions </div>
</div>

当我转到下一页时，它会更改div的类，因此第2页不是当前页面，而是显示新内容。我希望我的div只能在div类是＆＃34; current-page＆＃34;对于该页面。

Answer 1

更改页面时，您可以执行以下操作：

var currentID = $(".current-page").attr('id');
var page = currentID.substr(4); // skip over "page" prefix
$(".my-content").hide();
$(".my-content").eq(page-1).show();

Answer 2

<强>被修改

使用$ .eq（），$。index（），$ .show（）和$ .hide（）

var content = $('div.my-content').hide();//get all and hide
var i = $('div.current-page').index();//get index of the current
content.eq(i).show();//show selected index

OR inline

$('div.my-content').hide().eq($('div.current-page').index()).show();

如果存在具有特定类的div，则显示内容

2 个答案: