显示下拉列表的选择字段，引导程序中的jquery冲突

Question

很高兴见到大家。

我已经开始使用Bootstrap了，它很棒，我喜欢它。我正在打开一个带有表单的模式窗口。在这个表单中有一个选择字段。当有人点击"其他"时，它会显示一个字段来描述更多信息。它在我的笔记本电脑上运行得很好。然而，该网站是为移动设计的。当我在iphone或任何手机上加载它时，在选择其他后，你就不能再向下滚动模式窗口了。它锁定，褪色的背景滚动。

有人知道为什么吗，或者可能有一个简单的方法来解决这个问题。对不起，我希望这个问题不要太含糊。

这是我用来显示新表单字段的代码

$('select[name=jtype]').change(function(e){
if ($('select[name=jtype]').val() == '1'){
$('#jobName').show();
}else{
$('#jobName').hide();
}
});

以及模态窗口中的表单字段。

<div class="form-group">
<label class="col-md-4 control-label" for="jtype">Job  <span class="text-danger">*</span></label>  
<div class="col-md-8 controls">
<select name="jtype" id="jtype" required class="form-control">
<option value="" <?php if (!(strcmp('', $_POST['jtype']))) {echo "selected";} ?>> Please Select</option>
<option value="1" <?php if (!(strcmp('1', $_POST['jtype']))) {echo "selected";} ?>>Other</option>
<option value="2" <?php if (!(strcmp('2', $_POST['jtype']))) {echo "selected";} ?>>Quote</option>
</select>
</div>
</div>

<div id="jobName">
<div class="form-group">
<label class="col-md-4 control-label" for="job">New Job Here</label>  
<div class="col-md-8 ">
<input id="job" name="job" type="text" value="<?php if(isset($_POST['job'])){ echo $_POST['job'];}?>" placeholder="Create New Job Type Here"  class="form-control input-lg">
</div>
</div>
</div>

Answer 1

好了，伙计们，我找到了答案。Iphone的键盘和模态似乎有问题，所以有人创造了一个不错的解决方案。我会在哪里找到它，但我再也找不到链接了

if( navigator.userAgent.match(/iPhone|iPad|iPod/i) ) {
$('.modal').on('show.bs.modal', function() {
// Position modal absolute and bump it down to the scrollPosition
$(this)
.css({
position: 'absolute',
marginTop: $(window).scrollTop() + 'px',
bottom: 'auto'
});
// Position backdrop absolute and make it span the entire page
//
// Also dirty, but we need to tap into the backdrop after Boostrap 
// positions it but before transitions finish.
//
setTimeout( function() {
$('.modal-backdrop').css({
position: 'absolute', 
top: 0, 
left: 0,
width: '100%',
height: Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
) + 'px'
});
}, 0);
});
}