根据选定的框单击“提交”按钮时，URL无法打开

Question

我正在尝试使“提交”按钮基于选定的框打开特定的URL。我目前没有收到带有该网址的警报或新窗口。我使用了一些jQuery来切换一个类，以显示该框已被选中并将其放入函数中，然后在另一个函数内部创建了if else语句，该函数在标签内部调用了commit按钮。 这是代码

             $(document).ready(function() {
                 function buttonClicked() {
                  $(".blue").click(function(){
                $(this).toggleClass("red");
                 });
              }
                 return buttonClicked();
             });



            $(document).ready(function() {
                 function greenButtonClicked() {
                  $(".green").click(function(){
                $(this).toggleClass("red2");
                 });
              }
                 return greenButtonClicked();
             });


             function returnUrl() {
                 var greenButton = greenButtonClicked();
                var blueButton = buttonClicked();

              if( greenButton == true) {
                    window.open("https://www.google.com");
                    alert("button clicked!!")
              } else {
                    window.open("https://www.gmail.com");
                    alert("other clicked!!")
              }
             }

            .blue {
                width: 200px;
                height: 100px;
                background-color: blue;
                color: white;
                padding: 25px;
                box-sizing: border-box;
                cursor: pointer;
                transition: all .25s ease-in-out;
            }

            .green {
                width: 200px;
                height: 100px;
                background-color: green;
                color: white;
                padding: 25px;
                box-sizing: border-box;
                cursor: pointer;
                transition: all .25s ease-in-out;
            }

            .red {
                background-color: blue;
                border: 2px solid red;
            }

            .red2 {
                background-color: green;
                border: 2px solid red;
            }

<div class="blue">
 This is a clickable box
</div>
<div class="green">
  This is a clickable box
</div>
<input type="submit" value="Submit" onclick="returnUrl()">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 1

$(document).ready(function() {
                  $(".blue").click(function(){
                  greenButtonClicked = false;
                $(this).toggleClass("red");
                 });
                  $(".green").click(function(){
                  greenButtonClicked = true;
                $(this).toggleClass("red2");
                 });
});
var greenButtonClicked = false;
function returnUrl() {
              if( greenButtonClicked == true) {
                    window.open("https://www.google.com");
                    alert("button clicked!!")
              } else {
                    window.open("https://www.gmail.com");
                    alert("other clicked!!")
              }
             }

.blue {
                width: 200px;
                height: 100px;
                background-color: blue;
                color: white;
                padding: 25px;
                box-sizing: border-box;
                cursor: pointer;
                transition: all .25s ease-in-out;
            }

            .green {
                width: 200px;
                height: 100px;
                background-color: green;
                color: white;
                padding: 25px;
                box-sizing: border-box;
                cursor: pointer;
                transition: all .25s ease-in-out;
            }

            .red {
                background-color: blue;
                border: 2px solid red;
            }

            .red2 {
                background-color: green;
                border: 2px solid red;
            }

<div class="blue">
 This is a clickable box
</div>
<div class="green">
  This is a clickable box
</div>
<input type="submit" value="Submit" onclick="returnUrl()">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

看看是否有帮助。