Question

我的网站上有这个Bootstrap Modal，它可以解决所有问题，但Apple iOS。有没有人碰到这个/有任何想法从哪里开始，以解决这个问题？我尝试使用模拟器进行故障排除，这似乎工作正常，只是Iphone似乎无法正常工作。

这是按钮和模态，如果您需要更多信息或让我澄清，请告诉我。

谢谢！

＆＃13;

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>

<!--Button-->
<a data-toggle="modal" data-target="#myModal" class="tutorial__btn btn-green1 role-element leadstyle-link">Click Here To Sign Up</a>

<!--Modal-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
		  <div class="modal-dialog" role="document">
			<div class="modal-content">
			  <div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title" id="myModalLabel">Enter your email address and click the button below to get started.</h4>
			  </div>
			  
			  <div class="modal-body">
				<div id="inline1" class="popup_window">
					<form accept-charset="UTF-8" action="https://mk165.infusionsoft.com/app/form/process/5c8067cc4027e470304a973b2e87ce6d" class="infusion-form" method="POST">
						<input name="inf_form_xid" type="hidden" value="5c8067cc4027e470304a973b2e87ce6d" />
						<input name="inf_form_name" type="hidden" value="Brooks Knee Pain" />
						<input name="infusionsoft_version" type="hidden" value="1.48.0.48" />
                            <input type="hidden" id="inf_custom_UTMSource" name="inf_custom_UTMSource" value='<?php echo $_GET['utm_source']?>'/>
                            <input type="hidden" id="inf_custom_UTMMedium" name="inf_custom_UTMMedium" value='<?php echo $_GET['utm_medium']?>'/>
                            <input type="hidden" id="inf_custom_UTMTerm" name="inf_custom_UTMTerm" value='<?php echo $_GET['utm_term']?>'/>  
                            <input type="hidden" id="inf_custom_UTMCampaign" name="inf_custom_UTMCampaign" value='<?php echo $_GET['utm_campaign']?>'/>  
                            <input type="hidden" id="inf_custom_UTMContent" name="inf_custom_UTMContent" value='<?php echo $_GET['utm_content']?>'/>						
						<input class="infusion-field-input-container" id="inf_field_FirstName" name="inf_field_FirstName" type="text" placeholder="First Name"/>
						<input class="infusion-field-input-container" id="inf_field_LastName" name="inf_field_LastName" type="text" placeholder="Last Name"/>
						<input class="infusion-field-input-container" id="inf_field_Email" name="inf_field_Email" type="text" placeholder="Email"/>
						<input class="infusion-field-input-container" id="inf_field_Phone1" name="inf_field_Phone1" type="text" placeholder="Phone Number"/>
						<input type="submit" value="GET STARTED HERE" />
					</form>
					<p class="policy">We hate SPAM and promise to keep your email address safe. </p>
				</div>
			  </div>
			</div>
		  </div>
		</div>

＆＃13;

Answer 1

我刚刚发现了答案。似乎iOS需要一个额外的类，让safari知道按钮是可点击的。我在按钮上添加了额外的类，一切似乎都有效。

.clickable {
cursor: pointer;}

Answer 2

当href="#"缺失时，模式可能不会在Safari中显示，但会在其他浏览器上显示。

试试这个，看看是否有效：

<a data-toggle="modal" href="#myModal class="tutorial__btn btn-green1 role-element leadstyle-link">Click Here To Sign Up</a>

Answer 3

好的，现在试试这个PHP：

更改

!--Button-->
<a data-toggle="modal" data-target="#myModal" class="tutorial__btn btn-green1 role-element leadstyle-link">Click Here To Sign Up</a>

到

!--Button-->
<?php 

$iPod    = stripos($_SERVER['HTTP_USER_AGENT'],"iPod");
$iPhone  = stripos($_SERVER['HTTP_USER_AGENT'],"iPhone");
$iPad    = stripos($_SERVER['HTTP_USER_AGENT'],"iPad");

if( !$iPod || !$iPhone || !$iPad){ 
    echo "<a data-toggle='modal' data-target='#myModal' class='tutorial__btn btn-green1 role-element leadstyle-link'>Click Here To Sign Up</a>"
} else{
    echo "<a data-toggle='modal' a href='#myModal' class='tutorial__btn btn-green1 role-element leadstyle-link'>Click Here To Sign Up</a>"
}

?>

这应该做的是检测它是否是iOS设备，是否显示在iOS中有效的模式，如果它不显示另一个。试试吧。

Bootstrap Modal按钮无法正常工作，仅适用于iOS

3 个答案: