未捕获的SyntaxError

Question

我想要实现的是编写一个函数，在特定的css媒体查询中将按钮文本从BOX NAME 1更改为1。该功能不起作用，因为我收到此错误Uncaught SyntaxError: Unexpected token (。这是我写的第一个jQuery函数之一，所以我可能搞砸了我的语法。请帮忙。

PS。我知道我在我的jQuery函数中使用了.text-boxes-button类，但我的HTML中并不存在，但它只是SASS的扩展。

＆＃13;

＆＃13;

$(document).ready(function() {
    // run test on initial page load
    checkSize();

    // run test on resize of the window
    $(window).resize(checkSize);
});

//Function to the css rule
function checkSize(){
    if ($(".text-boxes-button").css("position") == "static" ){
        $("#button1").text("1");
        $("#button2").text("2");
        $("#button3").text("3");
        $("#button4").text("4");
    }
}

＆＃13;

.text-boxes-button {
    padding: 1.5em;
    display: inline-block;
    position: absolute;

    a {
        text-transform: uppercase;
        text-decoration: none;
        color: white;
        font-size: 2em;
    }
    @include mobile {
        position: static;
    }
}


#button1 {
    @extend .text-boxes-button;
    background-color: $button-blue;
    left: 0;
    top: 0;
}

#button2 {
    @extend .text-boxes-button;
    background-color: $button-red;
    top: 0;
    right: 0;
}

#button3 {
    @extend .text-boxes-button;
    background-color: $button-yellow;
    bottom: 0;
    left: 0;
}

#button4 {
    @extend .text-boxes-button;
    background-color: $button-green;
    bottom: 0;
    right: 0;
}

＆＃13;

<div class="text-buttons-wrapper">
  <div id="button1">
    <a href="#">Box name 1</a>
  </div>
  <div id="button2">
  <a href="#">Box name 2</a>
  </div>
  <div id="button3">
  <a href="#">Box name 3</a>
  </div>
  <div id="button4">
  <a href="#">Box name 4</a>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;