开发者

'If'-'else' statement within jQuery function

开发者 https://www.devze.com 2022-12-24 10:01 出处:网络
I have the following code in JavaScript and jQuery: $(\"<li />\") .html(\'Some HTML\') I would like to be able to change the content of .html by using an if-else statement. My code should be

I have the following code in JavaScript and jQuery:

     $("<li />")

     .html('Some HTML')

I would like to be able to change the content of .html by using an if-else statement. My code should be something like this, however it's not working.

var showinfo = <?php echo '$action'; ?>

$("<li />")

if (showinfo == 'action1'){
    .html('Some HTML')
else {
    .html('Other HTML')
}
开发者_如何学C

How should I change it?


Ternary operator?

$("<li />").html((showinfo == 'action1') ? 'Somehtml' : 'Other html');

The important thing to understand is that your first bit of code is being interpreted as one statement, not two:

 $("<li />")
 .html('Somehtml')

 //Is the same as:
 $("<li />").html('Somehtml');

You're getting mixed up because you're not using semicolons to terminate your statements. JavaScript allows this to support legacy code, but if you're writing code now you really should be using them.


Don't interrupt the jquery chaining:

var showinfo = '<?php echo $action; ?>'

if (showinfo == 'action1'){
    $("<li />").html('Somehtml')     
} else {
    $("<li />").html('Other html')
}

Note: I also corrected an error in your php echo statement and a missing bracket in your if...else


var listItem = $("#yourLi");

if (showinfo == 'action1'){
 listItem.html('Somehtml')     
else {
  listItem.html('Other html')
  }


Adam's answer is pretty spot-on. To save a little bit of unnecessary duplication however you could modify it slightly to this:

var
    showinfo = '<?php echo $action; ?>',
    listitems = $("<li />");

if (showinfo == 'action1') {
    listitems.html('Somehtml');     
} else {
    listitems.html('Other html');
}


You can shorten it as follows:

var showinfo = '<?php echo '$action'; ?>'


$("<li />")
.html( (showinfo == 'action1' ? 'Somehtml' : 'Other html') );

.html can be on the same line or a separate line as the statement is terminated with a semicolon. If you have multiple methods on a single selector I find separating them on multiple lines more readable.

0

精彩评论

暂无评论...
验证码 换一张
取 消