Как использовать элементы из html в javascript для события onclick? - PullRequest
0 голосов
/ 29 января 2019

У меня есть HTML-страница, которая выбирает видеоигру для вас на основе платформы и жанра.

Когда пользователь выбирает платформу и жанр из выпадающего списка, а затем нажимает кнопку Find game.Как мне выбрать эти варианты из платформы и жанра и вывести игру после того, как они нажмут Find Game?

Пример: Когда пользователь выбирает xbox и шутер.Он нажимает «Найти игру».Затем на веб-странице отображается «Gears of War».

HTML:

    <label for="platformType">
        Platform
    </label>
    <select name="platform" id="platformType">
        <option value="PC">(Choose Platform)</option>
        <option value="PC">PC</option>
        <option value="PS4">Playstation 4</option>
        <option value="switch">Switch</option>
        <option value="xbox">Xbox One</option>  
    </select>


    <label for="genreType">
        Genre
    </label>
    <select name="genre" id="genreType">
        <option value="PC">(Choose Genre)</option>
        <option value="Action">Action/Adventure</option>
        <option value="Fighter">Fighter</option>
        <option value="MMO">MMO</option>
        <option value="MOBA">MOBA</option>
        <option value="OpenWorld">Open World</option>
        <option value="Platformer">Platformer</option>
        <option value="Racing">Racing</option>
        <option value="RPG">RPG</option>
        <option value="Shooter">Shooter</option>
        <option value="Sports">Sports</option>
    </select>
    <input type="submit" value="Find Game" id="Submit" />

1 Ответ

0 голосов
/ 29 января 2019

Попробуй это.Вы можете добавить больше игр в игровой объект.

var games=[{name:'Forza',platform:'xbox',genre:'Racing'}]
var genre;
var platform;
$("#platformType").change(function(){
platform=$(this).val()
})
$("#genreType").change(function(){
genre=$(this).val()
})
$("#Submit").click(function(){games.filter((e)=>e.platform==platform && e.genre==genre?console.log(e.name):false)})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="platformType">
        Platform
    </label>
    <select name="platform" id="platformType">
        <option value="PC">(Choose Platform)</option>
        <option value="PC">PC</option>
        <option value="PS4">Playstation 4</option>
        <option value="switch">Switch</option>
        <option value="xbox">Xbox One</option>  
    </select>


    <label for="genreType">
        Genre
    </label>
    <select name="genre" id="genreType">
        <option value="PC">(Choose Genre)</option>
        <option value="Action">Action/Adventure</option>
        <option value="Fighter">Fighter</option>
        <option value="MMO">MMO</option>
        <option value="MOBA">MOBA</option>
        <option value="OpenWorld">Open World</option>
        <option value="Platformer">Platformer</option>
        <option value="Racing">Racing</option>
        <option value="RPG">RPG</option>
        <option value="Shooter">Shooter</option>
        <option value="Sports">Sports</option>
    </select>
    <input type="submit" value="Find Game" id="Submit" />
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...