Javascript 通过从用户处获取输入1或2并单击enter按钮，应根据输入更改模型

使用脚本从输入框中获取输入值，并且有两个不同的模型，分别命名为model1s和model2s，用户应在单击“回车”按钮时，根据该模型弹出的值给出1或2

<script>
  function myFunction() {       
     var input = document.getElementById('input').value;
     var abcd= document.getElementById('abcd'); 
     abcd.data-target = "model" + input + "s";          
  }
</script>

<div class="col-lg-3">
   <input type="text" placeholder="123" id="input" required>
   <button type="submit" onclick="myFunction();" class="btn btn-info" id="abcd">ENTER</button>
</div>

<div id="model1s" class="modal fade" role="dialog">
  <div class="modal-dialog">    
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>    
  </div>
</div>    

<div id="model2s" class="modal fade" role="dialog">
  <div class="modal-dialog">     
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>    
  </div>
</div>

函数myFunction（）{
var input=document.getElementById（'input'）。值；
var abcd=document.getElementById（'abcd'）；
abcd.data-target=“模型”+输入+s”；
}
进入
&时代；
模态头
模态中的一些文本

接近
&时代；
模态头
模态中的一些文本

接近

像这样尝试

queryselectoral（）

。首先隐藏所有的

modal

框，然后匹配给定的输入值

modal

框以显示

函数myFunction（）{
var input=document.getElementById（'input'）。值；
var abcd=document.getElementById（'abcd'）；
document.querySelectorAll（'.modal'）.forEach（函数（a）{
a、 style.display='none'；
})
document.getElementById（“model”+input+s”）.style.display='block'；
}

.modal{
显示：无；
}

进入
&时代；
模态1头
模态中的一些文本

接近
&时代；
Modal2收割台
模态中的一些文本

接近

请看这把小提琴，这是这个问题的一般解决方案

---

}))

我认为在代码中，您需要添加

<script>
function myFunction() {

     var input = document.getElementById('input').value;
     var abcd= document.getElementById('abcd'); 
     //abcd.data-target = "model" + input + "s";
     $("#model" + input + "s").modal('show');

}
</script>

函数myFunction（）{
var input=document.getElementById（'input'）。值；
var abcd=document.getElementById（'abcd'）；
//abcd.data-target=“模型”+输入+s”；
$（“#model”+输入+s”）.model（'show'）；
}

另外，你需要检查下面的链接

---

您的意思是说要从输入框值打开模型？例如，如果我键入model2s并按enter键，它应该是打开的modelbox model2s？是的，实际上我只想这样做，但在这里我尝试根据数据输入1或2，目标值将更改@Ghanshyam BhavaI think@prasad和Ninja已经完成了您想要的。查看他的片段。谢谢你的建议，现在它可以工作了fine@GhanshyamBhavaThanks，你救了我的命time@saravanakumar不客气。请接受这个答案：）我也尝试过你的解决方案，效果很好，谢谢@smith shah

<script>
function myFunction() {

     var input = document.getElementById('input').value;
     var abcd= document.getElementById('abcd'); 
     //abcd.data-target = "model" + input + "s";
     $("#model" + input + "s").modal('show');

}
</script>