使用JQUERY从HTML中选择文本

时间:2017-10-09 21:08:45

标签: javascript jquery html

我正在尝试获取所选元素的值并在控制台中显示它。我搜索了一切,尝试了一切,但它没有用。 value1我得到了它但是值2和3没有。

如果您有任何其他建议(除了使用Jquery执行此操作,请执行此操作)

检查出来

<span> Existing : {{(users | existingUser : true)?.length}} </span>
<span> NON-Existing : {{(users | existingUser : false)?.length}} </span
 $(document).ready(function() {

        $("button").click(function() {

            var value1 = $("#name-input").val();
            var value2 = $("#place-input").filter(":selected").text();
            var value3 = $("#tecnico-input").find(":selected").text();
            console.log(value1 + ' ' + value2 + ' ' + value3);
       
        });

    });

我非常感谢你的帮助。

3 个答案:

答案 0 :(得分:2)

.filter将选择器应用于前一个选择器选择的集合。但:selected不适用于<select>元素,它适用于其中的<option>元素。使用.find()搜索其他元素中的元素。

var value2 = $("#place-input").find("option:selected").text();

或更简单:

var value2 = $("#place-input option:selected").text();

此外,您不能在元素中包含两个id属性。 id="sel1" id="place-input"应该是id="place-input",对于其他<select>也是如此。

答案 1 :(得分:2)

不要在一个标签中使用两个ID

&#13;
&#13;
$("input[type='button'").on('click',function() {
   var value1 = $("#name-input").val();
   var value2 = $("#place-input option:selected").text();
   var value3 = $("#technician-input option:selected").text();
   console.log(value1 + ' ' + value2 + ' ' + value3);
 });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="click" />
<div class="input-group">
  <span class="input-group-addon" id="basic-addon1">Name:</span>
  <input type="text" class="form-control" placeholder="Ex.: John" aria-describedby="basic-addon1" id="name-input">
</div>
<div class="form-group">
  <label for="sel1">Place:</label>
  <select class="form-control"  id="place-input">
      <option selected value="1">Fixed</option>
      <option value="2">Mobile</option>
  </select>
</div>
<div class="form-group">
   <label for="sel2">Technician:</label>
   <select class="form-control"  id="technician-input">
      <option  value="1">Brandon</option>
     <option value="2">Justin</option>
     <option selected value="3">Ryan</option>
      <option value="4">Tyler</option>
   </select>
</div>
&#13;
&#13;
&#13;

答案 2 :(得分:1)

你做得对。您已经为HTML中的每个id标记添加了两个select属性。 HTML标准表明每个DOM元素只能设置一个id。这意味着,如果您将id替换为您在javascript代码中使用的.filter(":selected").text() s,反之亦然,那么您将使用 if (!string.IsNullOrEmpty(queryObj.JobBoard)) query = query.Where(j => j.JobBoard.JobBoardName.Contains(queryObj.JobBoard)); if (!string.IsNullOrEmpty(queryObj.Division)) query = query.Where(j => j.Division.Contains(queryObj.Division)); if (!string.IsNullOrEmpty(queryObj.City)) query = query.Where(j => j.City.Contains(queryObj.City)); if (!string.IsNullOrEmpty(queryObj.State)) query = query.Where(j => j.State.StateName.Contains(queryObj.State)); 代码获得所需的结果。