Как создать текстовое поле автозаполнения с помощью увеличительного стекла «Поиск» - PullRequest
Новая
       2

Как создать текстовое поле автозаполнения с помощью увеличительного стекла «Поиск»

2 голосов
/ 30 сентября 2011

Если я создаю текстовое поле в Firefox с типом «автозаполнения», я могу заставить автозаполнение работать правильно. Однако текстовое поле предназначено для использования в качестве текстового поля поиска (с автозаполнением). Таким образом, в дополнение к автозаполнению я также хочу использовать стандартный интерфейс пользователя, когда текстовое поле имеет тип «поиск». В частности, Firefox показывает увеличительное стекло, которое превращается в «Х», когда пользователь вводит его.

Есть ли чистый (или, если не так, не очень чистый) способ сделать это?

1 Ответ

3 голосов
/ 30 сентября 2011

Панель поиска Firefox, обычно справа вверху, имеет type="autocomplete" и имеет searchbutton

Первое: browser.xul Firefox имеет toolbaritem, в которое searchbar вложено. 

    <toolbaritem id="search-container" title="&searchItem.title;"
               align="center" class="chromeclass-toolbar-additional"
               flex="100" persist="width" removable="true">
    <searchbar id="searchbar" flex="1"/>
    </toolbaritem>

searchbar имеет следующее свойство css в browser.css.

    searchbar {
      -moz-binding: url("chrome://browser/content/search/search.xml#searchbar");
    }

Этот URL в свойстве css приводит нас к search.xml, который имеет textbox, а searchbutton добавляется к textbox в hbox, насколько я понимаю. 

    <xul:textbox class="searchbar-textbox"
               anonid="searchbar-textbox"
               type="autocomplete"
               flex="1"
               autocompletepopup="PopupAutoComplete"
               autocompletesearch="search-autocomplete"
               autocompletesearchparam="searchbar-history"
               timeout="250"
               maxrows="10"
               completeselectedindex="true"
               showcommentcolumn="true"
               tabscrolling="true"
               xbl:inherits="disabled,disableautocomplete,searchengine,src,newlines">
    <xul:box>
      <xul:button class="searchbar-engine-button"
                  type="menu"
                  anonid="searchbar-engine-button">
        <xul:image class="searchbar-engine-image" xbl:inherits="src"/>
        <xul:image class="searchbar-dropmarker-image"/>
        <xul:menupopup class="searchbar-popup"
                       anonid="searchbar-popup">
          <xul:menuseparator/>
          <xul:menuitem class="open-engine-manager"
                        anonid="open-engine-manager"
                        label="&cmd_engineManager.label;"
                        oncommand="openManager(event);"/>
        </xul:menupopup>
      </xul:button>
     </xul:box>
     <xul:hbox class="search-go-container">
      <xul:image class="search-go-button"
                 anonid="search-go-button"
                 onclick="handleSearchCommand(event);"
                 tooltiptext="&searchEndCap.label;" />
     </xul:hbox>
    </xul:textbox>

Ну, это не полный ответ, но дает старт для вас или других, кто может внести свой вклад, я думаю.Для получения более подробной информации вы можете найти файл omni.jar в каталоге Mozilla Firefox.

...