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

很高兴认识大家

我已经开始使用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>

工作*
>其他
好了，伙计们，我找到答案了。看来Iphone的键盘和modals都有缺陷，所以有人创造了一个很好的解决方案。我会把它贴在我找到的地方，但我再也找不到链接了

  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);
    });
}

欢迎来到stackoverflow！：）您能在JSFIDLE中提供一个快速演示吗@塞巴斯蒂安·荷米埃是的，当然。我从来没有这样做过，所以这里有一个小提琴，但是我已经在我的手机上测试过了，它在小提琴上很好，所以我认为这是不同的表现。那么你的代码中的其他部分可能会导致问题。你有项目的链接吗？是的，当然让我重新创建页面，这样你就不必登录并删除一些链接；）一秒钟