使用JavaScript onClick将类更改为活动

时间:2013-08-25 13:33:02

标签: javascript html css

我已经尽力自己解决这个问题但是因为我不熟悉网络开发而无济于事。这可能是非常基本的,但我真的很感激一些帮助,因为我在这里转圈......

我有一张谷歌地图搜索表单(本质上是一个商店定位器),我为搜索结果所做的工作分为两个选项卡。列表和地图。

我想要做的是在搜索表单中按下提交按钮时,地图标签始终是活动标签。

这是HTML代码:

<ul class="nav nav-tabs" id="myTab">
  <li id="maptab" class="active"><a href="#resmap">Map</a></li>
  <li id="listtab" ><a href="#reslist">List</a></li>
</ul>
<div class="tab-content">
  <div class="tab-pane active" id="resmap">
    <div id="map_canvas"></div>
  </div>
  <div class="tab-pane" id="reslist">
    <div id="results">
      <ul class="res-list" id="list"></ul>
    </div>
  </div>
</div>

所以基本上对于地图项我试图让代码返回

div class="tab-pane active"

li class="active"

据推测,我必须在提交按钮中添加一个onclick元素?

表单中提交按钮的html为

<input type="submit" name="op" id="edit-submit" value="Search" class="btn btn-primary" />

1 个答案:

答案 0 :(得分:0)

在您的情况下,我假设您正在尝试将“active”类添加到该li元素:

var button = document.getElementById('edit-submit');

button.onclick= function() {

    // this adds the 'active' class to the classes that the element already has
    var maptab = document.getElementById('maptab');

    maptab.className = maptab.className + ' active';
};