Как я могу предотвратить изменение стиля атрибута html select on size?
<svg>
<foreignObject>
<select name="select1" onmousedown="if(this.options.length>5){this.size=5;}" onchange='this.size=1;' onblur="this.size=0;">
<option value="1">This is select number 1</option>
<option value="2">This is select number 2</option>
<option value="3">This is select number 3</option>
<option value="4">This is select number 4</option>
<option value="5">This is select number 5</option>
<option value="6">This is select number 6</option>
<option value="7">This is select number 7</option>
<option value="8">This is select number 8</option>
<option value="9">This is select number 9</option>
<option value="10">This is select number 10</option>
<option value="11">This is select number 11</option>
<option value="12">This is select number 12</option>
</select>
</foreignObject>
</svg>
Здесь - скрипка, потому что по некоторым причинам я не могу запуститьHTML в скрипте SO.
То, что я пытался сделать, это перехватить все изменения стиля с помощью инструментов разработчика Chrome, но их слишком много (изменений).
Мне нужноизмените размер таким образом, чтобы можно было накладывать ограничение на число видимых сразу параметров в select.
Чтобы избежать возможной проблемы x-y: мне нужно сделать прокруткураскрывающийся список в svg с использованием foreignObject и html select.
Я хотел бы иметь возможность выбирать только один параметр за раз.
Согласно this вопрос, конкретно к ответу:
Поведение зависит от браузера и не может контролироваться автором.Вы можете использовать атрибут size = 10 в элементе, но он также меняет меню на список, так что 10 опций будут видны, даже если меню не сфокусировано.Чтобы реализовать описанное вами поведение, вам нужно создать собственные элементы управления с использованием JavaScript и CSS.
Я могу сказать, что мой вопрос касается сохранения menu и не изменения стиля на listbox стиль.