Question

我有一个下拉列表，允许用户过滤他们的查询。

<select id="bike_category_filter" multiple="multiple">
  <optgroup label="Gender">
    <option value="Mens">Mens</option>
    <option value="Womens">Womens</option>
  </optgroup>
  <optgroup label="Type">
    <option value="Mountain Bike">Mountain Bike</option>
      <option value="Hybrid">Hybrid</option>
      <option value="Road">Road</option>
  </optgroup>
</select>

我希望在哈希中发送选定的选项，例如

{ gender: 'Mens', style: ['Mountain Bike', 'Road'] }

因此，点击选项Men || Womens后，我想添加关键字Gender以及我想添加到style: ['values here']的任何类型。

我如何实现这样的事情，以及我可以从jQuery库中使用哪些方法？

Answer 1

＆＃13;

HashSet<Long>

＆＃13;

var result = {
    gender: '',
    style: []
};

$('#bike_category_filter').change(function() {
    var selected = $('option:selected', this),
        val = selected.val(),
        index = '';

    if (!val) {
        return;
    }

    switch (selected.parent()[0].label) {
        case 'Gender':
            result.gender = val;
            // reset style for selected gender
            result.style = [];
            break;
        case 'Type':
            (index = result.style.indexOf(val) === -1) 
                ? result.gender && result.style.push(val)
                : result.style.splice(index, 1);
            break;
    }

    $(this).val(result.style.concat([result.gender]));
    $('code').html(JSON.stringify(result));
});

＆＃13;

select {
  height: 130px;}

code {
  display: block;
  margin: 15px 0;}

＆＃13;

Answer 2

基本算法是：

每次用户选择/取消选择一个值时：
- 将result重置为空对象
- ：
  - 将label属性的值存储在变量groupName
  - 初始化一个新的空groupSelections数组
  - 用于<option>中用户已选择的每个<optgroup>标记：
    - 将option的值添加到groupSelections
  - 设置result[groupName] = groupSelections

最后，每个result的{{1}}对象中应该有一个属性，每个属性都应该是一个列出所选optgroup个值的数组option。

这是代码：

＆＃13;

optgroup

＆＃13;

var result;
$('#bike_category_filter').change(function() {
  result = {};
  $(this).find('optgroup').each(function() {
    var groupName = $(this).attr('label');
    var groupSelections = [];
    $(this).find('option:selected').each(function() {
      groupSelections.push($(this).val());
    });
    result[groupName] = groupSelections;
  });
  $('#result').html(JSON.stringify(result));
});

＆＃13;

Answer 3

你可以这样做：

<?php

//telegram sdk and configuration
$client = new Zelenin\Telegram\Bot\Api('someRandomToken');

$update = json_decode(file_get_contents('php://input'));

//your app
try {

    if($update->message->text != '/next_event_datetime')
        exit;

    $dom = Sunra\PhpSimple\HtmlDomParser::file_get_html('http://laratalks.com/');
    $element = $dom->find('#location header.section-header h3', 0);
    $dateTime = $element->plaintext;

    $response = $client->sendMessage([
        'chat_id' => $update->message->chat->id,
        'text' => $dateTime
    ]);

} catch (\Zelenin\Telegram\Bot\NotOkException $e) {

    //echo error message ot log it
    //echo $e->getMessage();

}

我建议你像上面一样创建一个样式对象，并将性别设置为键，将数组设置为值。

当选择用户更改时，将调用var styles = { "men": ['Mountain Bike', 'Road'], "women": [...] }; $( "select" ).change(function () { var gender = $( "select option:selected" ).val(); $("your elment").addClass(styles[gender].join(" ")); });回调，然后此change将返回所选元素的值（在我们的示例中为性别）。当您使用此语法$( "select option:selected" ).val();时，styles是一个对象，您将获得men键的值。

使用jQuery从过滤器菜单创建键/值对

3 个答案: