Question

我需要手动编写javascript切换功能。请帮助理解我该怎么做。

Answer 1

以下是切换的function

function toggle(obj) { // obj is element's id to be toggled

    var el = document.getElementById(obj);

    if ( el.style.display != 'none' ) { //if display of element is block
        el.style.display = 'none'; // sets to none
    } else {
        el.style.display = ''; //sets null or block
    }

}

只需查看http://www.dustindiaz.com/seven-togglers/

即可

Answer 2

function toggle(id){
    var el = document.getElementById(id);
var status = el.style.display;
if(status=='none'){
    el.style.display = 'block';
}else{
    el.style.display = 'none';
}

}

Answer 3

切换三元风格：

function toggle(objId) { // Pass the id of the object to be toggled

    // Get the element
    var el = document.getElementById(objId);

    // Toggle the style-display
    el.style.display = (el.style.display != 'none' ? 'none' : '' );
}

Answer 4

不知道你想做什么，但这是一个简单的例子：

这是html

<li class="foo" style="display:none">List item</li>
<li class="foo" style="display:none">List item</li>
<li class="foo" style="display:none">List item</li>
<li class="foo" style="display:none">List item</li>
<li class="foo" style="display:none">List item</li>
<li class="foo" style="display:none">List item</li>

这是切换脚本：

  <script language="javascript">
  function toggle (className) { 
  _ref = document.getElementsByClassName(className);
  for (_i = 0, _len = _ref.length; _i < _len; _i++) {
      el = _ref[_i];
      if (el.style.display === 'block') {
      el.style.display = 'none';
      } else {
          el.style.display = 'block';
      }
  }
  }
</script>

我怎样才能手动编写切换功能？

4 个答案: