在一个按钮jQuery中获取两个选择值

时间:2018-10-09 04:32:48

标签: jquery

我想一键获得两个值,所以当他们单击搜索时,将出现一个模态,这是我当前的代码。但是当我尝试使用此代码时,只有一个值出现

<select id="search" class="modal-trigger" name="search" data-modal="modal-name">
    <option selected="selected" value="select">Select an Event</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="all">All</option>
</select>

<select id="searchcity" class="modal-trigger" name="searchcity" data-modal="modal-name">
    <option selected="selected" value="select">Search a City</option>
    <option value="City1">City1</option>
    <option value="City2">City2</option>
    <option value="City3">City3</option>
    <option value="City4">City4</option>
    <option value="City5">City5</option>
</select>
<button id="searchnow">Search</button> 
      $("#searchnow").click(function () {

    var selectedCity = $("#searchcity").val();
    var selectedEvent = $("#search").val();

    console.log(selectedCity)
    console.log(selectedCity)
    $.getJSON('events.json', 
         function (data) {
        render(selectedCity, data);
    });
});

1 个答案:

答案 0 :(得分:2)

您实际上正在将所有事情都做得完美。 我能找到的唯一问题是您正在做console.log相同的变量

 console.log(selectedCity)
    console.log(selectedCity)

将其更改为

console.log(selectedCity)
    console.log(selectedEvent )

 $("#searchnow").click(function () {

    var selectedCity = $("#searchcity").val();
    var selectedEvent = $("#search").val();

    console.log(selectedCity)
    console.log(selectedEvent)
    $.getJSON('events.json', 
         function (data) {
        render(selectedCity, data);
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="search" class="modal-trigger" name="search" data-modal="modal-name">
    <option selected="selected" value="select">Select an Event</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="all">All</option>
    </select></p>

<select id="searchcity" class="modal-trigger" name="searchcity" data-modal="modal-name">
<option selected="selected" value="select">Search a City</option>
<option value="City1">City1</option>
<option value="City2">City2</option>
<option value="City3">City3</option>
<option value="City4">City4</option>
<option value="City5">City5</option>
</select>
<button id="searchnow">Search</button>