bootstrap警告消息输入数据

时间:2015-10-26 13:14:07

标签: html twitter-bootstrap

我要问一个非常简单的问题是一个愚蠢的问题。

我正在尝试在引导警告消息中显示输入值。

所以如果我输入类似“apple”的东西

在警告信息中应该显示“苹果不存在!!”

那么我如何将输入类型 "inputSearch" 放在消息的开头...... !!

<input  type="text" id= "inputSearch" name="inputSearch">

<div class="alert alert-warning">
   // how can i put the input type "inputSearch" here
   <strong> does not exist !!</strong>
</div>

那么如何在警告信息中显示输入数据“inputSearch”

2 个答案:

答案 0 :(得分:2)

试试这个:http://jsfiddle.net/eddowii/rqh2461v/2/

HTML:

<input  type="text" id= "inputSearch" name="inputSearch">

<div class="alert alert-warning">
    <span id="textspan"></span><strong> does not exist !!</strong>
</div>

JS:

jQuery('#inputSearch').on('input', function() {
    $('#textspan').html($('#inputSearch').val());
});

答案 1 :(得分:2)

这是一个非jquery示例:

  var input = document.getElementById('inputSearch');
  if (input.addEventListener) {
    input.addEventListener('input', handleSearch, false);
  } else if (input.attachEvent) {
    input.attachEvent('input', handleSearch); // old IE support
  }

  function handleSearch(evt) {
    var input = document.getElementById('inputSearch');
    var span = document.getElementById('textSpan');
    span.textContent = input.value;
  }
  <input type="text" id="inputSearch" name="inputSearch">

  <div>
    <span id="textSpan"></span><strong> does not exist !!</strong>
  </div>