可以't使jquery If Else正常工作

Can't get jquery If-Else to function properly

本文关键字：常工作 工作 Else If jquery 可以      更新时间：2023-09-26

这可能是我盯着这个看太久了，我编写的函数并没有那么复杂，但无论出于什么原因，我都无法使它正常运行。h1标记按其应有的方式更改，但我的if-else似乎没有基于"page_layout"变量运行。我的代码如下。。。有什么想法吗？

<script>
    $(document).ready(
     function() {
         //Set text for H1 tags here
         var title = "Test title";
         //Set main-image layout here (1,2,3,4)
         var page_layout = "1";
         //If page_layout = 4, then set connected-image for top
         var connected_image = "images/connected-image.jpg";
         //Image for main-image area
         var main_image = "images/main-image.jpg";
         //Set main-image text here
         var main_image_text = "See how this works.";
         //Set main-image-text-url location
         var main_image_text_url = "http://www.example.com";
         //Do not touch this code
        $('h1').html(title);
        if (page_layout == "1"){
            $.('#main-image').css('background-image', main_image);
            $.('#main-image').css('background-position', 'top right');
            $.('#main-image').css('background-repeat','no-repeat');
            $.('#main-image').addClass('padding-21');
            $.('#main-image').html(main_image_text);
            $.('#main-image').append('<br><a href="' + main_image_text_url + '">tell me more</a>');
        }else if (page_layout == "2"){
            $.('#middle').css('font-size','15px');
            $.('#main-image').addClass('padding-21');
            $.('#main-image').html(main_image_text);
            $.('#main-image').append('<br><a href="' + main_image_text_url + '">tell me more</a>');
        }else if (page_layout == "3"){
            $.('#main-image').css('background-image', main_image);
            $.('#main-image').css('background-position', 'top left');
            $.('#main-image').css('background-repeat','no-repeat');
            $.('#main-image').addClass('padding-491');
            $.('#main-image').html(main_image_text);
            $.('#main-image').append('<br><a href="' + main_image_text_url + '">tell me more</a>');
        }else if (page_layout == "4"){
            $.('connected-image').css('background-image', connected_image );
            $.('connected-image').css('background-position', 'top right');
            $.('connected-image').css('background-repeat','no-repeat');
        }else{
            //Nothing
        }
     }
    )
</script>

对于初学者来说，您应该在javascript控制台中看到一些语法错误。您需要将选择器从$.('selector')更改为$('selector')（删除$之后的.）。

此外，$('connected-image')可能应该使用类选择器$('.connected-image')。

可能还有其他问题，因为您看到的行为并不清楚，但不应该在$和open paren之间使用句点。

即

$('connected-image').css('background-repeat','no-repeat');

不是

$.('connected-image').css('background-repeat','no-repeat');

在每个if-else块中，添加：

console.log("This is case 1");
// ... do this inside each if-else {...}
console.log("This is case 4");

然后在firebug控制台打开的情况下重新加载页面，并检查块是否正在执行。如果是，那么您就知道If-else条件运行良好，并且If-elses块中的语句一定有问题。

相关文章：