用jquery更改html

我需要用jquery在一个div上单击更改文本。就像这样：用jquery更改html

$(document).ready(function() { 
$("#hideall").click(function() { 
$("#hideall").html("<p>SHOW</p>"); 
}); 
});

HTML是：

<div id="hideall" title="Hide all" name="Hide all"> 
<p>HIDE</p> 
</div>

的问题是，它应该是这样的div显示状态，当它是隐藏的，它显示

<p>SHOW</p>

当它的表现它的

<p>HIDE</p>

我意识到临屋区吨应该与“如果”功能，但不能分解。任何帮助？谢谢。

来源

2013-01-15 Emir Dupovac

您可以创建一个变量来检查此状态。

$(document).ready(function() { 
var isHidden = false; 
$("#hideall").click(function() { 
if(isHidden){ 
    $(this).html("<p>SHOW</p>"); 
    isHidden = false; 
} 
else{ 
    $(this).html("<p>Hidden</p>"); 
    isHidden = true; 
} 
});//end click function 
});//end ready

来源

2013-01-15 01:59:18 lukeocom

像这样的东西应该工作

$(document).ready(function() { 
    $("#hideall").toggle(function() { 
     $(this).text('HIDE'); 
    }, function() { 
     $(this).text('SHOW'); 
    }); 
});

演示：http://jsfiddle.net/UN76V/

来源

2013-01-15 01:56:50 Blender

他也可以与目标的$ P（ “＃hideall P”） –

或者你也可以解决使用一种称为隐藏的类此问题。

$(document).ready(function() { 
    $("#hideall").click(function() { 
     if ($(this).is('.hidden') { 
      $(this).removeClass('hidden').html("<p>SHOW</p>"); 
     } else { 
      $(this).addClass('hidden').html("<p>HIDE</p>"); 
     } 
    }); 
    });

来源

2013-01-15 01:57:34 insomiac

试试这个

$(document).ready(function() { 
    $("#hideall").on('click', function() { 
    var $p = $(this).find('p'); 
    var txt = 'SHOW'; 
    if ($p.text() === 'SHOW') { 
     txt = 'HIDE'; 
    } 
    $p.text(txt); 
    }); 
});

Check Fiddle

来源

2013-01-15 01:59:49

用jquery更改html

回答

相关问题