Question

我想运行一个自己创建的函数然后当运行jQuery Mobile PopUp时，却不知道怎么办？

以下是我认为应该做的事情：

$(document).ready(function() {
   var finished = false;
   $("#mytest").click(function() {
      // RUN MY FUNCTION AND THE IF TRUE RUN POPUP
      if(finished == true){
         // ACTIVATE JQUERY MOBILE POPUP FUNCTION
      }
   });
});

然后我应该像这样激活mytest函数：

<a style="height: 75px;" href="" data-rel="popup" data-role="button" id="mytest">Test</a>

但似乎没有发生什么事？我似乎没有进入mytest功能？当我进入时，如何激活弹出功能？

希望得到帮助： - ）

Answer 1

查看工作示例：finished == true和finished == false：点击按钮，看看会发生什么...... 1）finished == true：弹出窗口自动打开 2）finished == false：我使用return false来阻止打开弹出窗口

脚本：

 $(document).bind('pageinit', function() {
       $("#mytest").click(function() {
         var finished = false;
         // RUN MY FUNCTION AND THEN IF TRUE RUN POPUP (WILL OPEN AUTOMATICALLY)
         if(finished == false){
           // PREVENT OPENING POPUP
           return false;
         }
       });
     });

完整示例：

<html>
<head>
    <meta charset="utf-8">
    <title>popup</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>

<body>
  <div data-role="page" id="myPage">
    <div data-role="content">
      <h1>Popup</h1>
      <a style="height: 75px;" href="#eat" data-rel="popup" data-role="button" id="mytest">Test</a>
    </div>

    <section data-role="popup" data-overlay-theme="a" id="eat">
      Are you sure you want to eat?
    </section>

    <script>
     $(document).bind('pageinit', function() {
       $("#mytest").click(function() {
         var finished = false;
         // RUN MY FUNCTION AND THEN IF TRUE RUN POPUP (WILL OPEN AUTOMATICALLY)
         if(finished == false){
           // PREVENT OPENING POPUP
           return false;
         }
       });
     });
    </script>
  </div>

</body>
</html>

Answer 2

试试这个！

    <!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8">
    <title>popup</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

      <script>
       $().ready(function () {
          $(document).bind('pageinit', function () {
              $("#mytest").click(function () {
                  var finished = false;
                  // RUN MY FUNCTION AND THEN IF TRUE RUN POPUP (WILL OPEN AUTOMATICALLY)
                  if (finished == false) {
                      // PREVENT OPENING POPUP
                      return false;
                  }
              });
          });

      });
    </script>
</head>

<body>
  <div data-role="page" id="myPage">
    <div data-role="content">
      <h1>Popup</h1>
      <a style="height: 75px;" href="#eat" data-rel="popup" data-role="button" id="mytest">Test</a>
    </div>



    <div data-role="popup" id="eat" data-theme="c" data-overlay-theme="c">
    Eat Something
    </div>


  </div>

</body>
</html>

运行函数，然后使用jQuery Mobile激活函数？

2 个答案: