Question

我目前正面临一个过去4个小时让我发疯的问题。

我在页面上使用Jquery Mobile来创建模态/弹出窗口。此弹出窗口有5个包含href链接的容器。当在移动浏览器上打开页面并加载弹出窗口时，容器会垂直下降，用户必须向下滚动并选择必要的链接才能继续。

在除了移动版Safari之外的每个浏览器上，我都可以向下滚动到任何链接，然后点击它们并加载链接。但是在Mobile Safari上，只有前两个链接是可点击的。当你点击其他任何一个时，它会跳到模态窗口的顶部。 URL带有下划线。这类似于您通过文本链接标记任何页面上的链接时所看到的内容。

除了href网址之外，所有容器的代码都是相同的，但是我已将它们检查为死亡＆amp;他们都使用移动chrome / firefox。

非常感谢任何指导/提示，以便调试和解决为什么移动游猎很奇怪。

编辑：添加代码：

模态窗口包含由某些javascript定义的链接（即用户更改了一些下拉菜单，这会更改模态窗口中的URL：

<script type="text/javascript">
$(document).ready(function(e) {
$('.button_change').change(function(e) {

var an = $(this).val();
var d1 = $("#id_1").find(":selected").attr("name");
var d2 = $("#id_2").find(":selected").attr("value");
var d3 = $("#id_3").find(":selected").attr("value");
var d5 = $("#id_4").find(":selected").attr("value");
    var d4 = $("#id_5").find(":selected").attr("value");


var option1_url = ("https://localhost:8888/register/" + d4 + d1 + "/plan1" + "/?utm_term=" + d3  + "&utm_medium=" + d5);
var option2_url = ("https://localhost:8888/register/" + d4 + d1 + "/plan2" +"/?utm_term=" + d3 + "&utm_medium=" + d5);
var option3_url = ("hhttps://localhost:8888/register/" + d4 + d1 + "/plan3" +"/?utm_term=" + d3  + "&utm_medium=" + d5);
var option4_url = ("https://localhost:8888/register/" + d4 + d1 + "/plan4" +"/?utm_term=" + d3 + "&utm_medium=" + d5);
var popup_modal =("#myPopupDialog");

$('.button-plans1 a').attr('href',option1_url);
$('.button-plans2 a').attr('href',option2url);
$('.button-plans3 a').attr('href',option3_url);
$('.button-plans4 a').attr('href',option4_url);


});
});
</script>

HTML：

<div class="btn btn-primary button-plans-popup clickable">
      <a class="button-color" href="#myPopupDialog" data-rel="popup" data-position-to="window" data-transition="fade">NEXT</a>
</div>

<div data-role="main" class="ui-content">

    <div data-role="popup" id="myPopupDialog" data-overlay-theme="b">
      <div data-role="header">
        <h1>Modal Window</h1>
      </div>

      <div data-role="main" class="ui-content">



<div class="selection-types">


  <div class="module option1" style='display:none;' id='option1'>
     <div class="inner">     
        <div class="button-plans1">
      <a href="/signup/option1/" class="button">Register for Plan 1</a>
      </div>
    </div>
  </div>

        <div class="module option2" style='display:none;' id='option2'>

    <div class="inner">


        <div class="button-plans2">
      <a href="/signup/option2/" class="button">Register for Plan 2</a>
    </div>
    </div>
  </div>



  <div class="module option3" style='display:none;' id='option3'>

    <div class="inner">

        <div class="button-plans3">
      <a href="/signup/option3/" class="button">Register for Plan 3</a>
      </div>
    </div>
  </div>

  <div class="module option4" style='display:none;' id='option4'>

    <div class="inner">


        <div class="button-plans4">
      <a href="/signup/option4/" class="button">Register for Plan 4</a>
      </div>
    </div>
  </div>

Jquery Mobile - Mobile Safari上弹出窗口中的URL

0 个答案: