时间戳

首页 > 解决方案 > 更改切换开关上的工具提示文本

javascript - 更改切换开关上的工具提示文本

问题描述

如何更改切换开关上的工具提示文本。
1）首先，默认情况下，我必须提供一些工具提示
2）另外，每当我点击切换开关时，我都必须更改工具提示但是下面的代码无法正常工作

问题
1）我得到的工具提示不正确。它不是来自基金会。谁能告诉我如何使这个工具提示美化或只是添加一类基础

谁能指导我哪里做错了

我正在使用基础 5

<ul class="header-info details collapse ch_en_switch">
    <li class="switch small" onclick="chn_tooltip"  id="chinese_toggle_tooltip" aria-haspopup="true" title="click to see player name in chinese">
      <span class="switch_text">EN</span>
      <input id="chn_eng_toggle" onclick="chinese_toggle" type="checkbox">
      <label for="chn_eng_toggle"></label>
      <span class="switch_text">CH</span>
    </li>
  </ul>




    function open_tooltip(){
       $(this).click(function(e){
       if ( $( '#chn_eng_toggle' ).is(':checked') ){
         $( '#chinese_toggle_tooltip' ).attr( 'title', '' )
         $( '#chinese_toggle_tooltip' ).attr( 'title', 'click to see player name in english' ).foundation('toggle')
       }
       else{
         $( '#chinese_toggle_tooltip' ).attr( 'title', '' )
         $( '#chinese_toggle_tooltip' ).attr( 'title', 'click to see player name in chinese' ).foundation('toggle')
       }
       });
    }

标签： javascriptjquerytooltipzurb-foundation

解决方案

试试这个https://jsfiddle.net/pnnvqj6g/

<ul class="header-info details collapse ch_en_switch">
  <li class="switch small" data-tooltip-class="aniket" id="chinese_toggle_tooltip" data-tooltip aria-haspopup="true" title="">
    <span class="switch_text">EN</span>
    <input id="chn_eng_toggle" type="checkbox" onclick="open_tooltip()">
    <label for="chn_eng_toggle"></label>
    <span class="switch_text">CH</span>
  </li>
</ul>


function open_tooltip(){
  if ($("#chn_eng_toggle").is(":checked")) {
    $('#chinese_toggle_tooltip').attr('title', 'aniket');
  } else {
     $('#chinese_toggle_tooltip').attr('title', 'shivam');
  }
}

推荐阅读