Используя jqTransform в скрытой форме контакта, выберите значение поля, которое не отображается

89
9

Извините, если это боль в заднице, но я действительно мог бы здесь помочь:


http://dev.rjlacount.com/treinaAronson-form/


Форма контакта можно увидеть, нажав кнопку "Контакт" в левом верхнем углу. Я использую плагин jqTransform jQuery для его стилизации. Сначала он скрывается с дисплеем: none; применяется к div с идентификационной панелью и вставляется со следующим:


$("#flip").click(function(e){
e.preventDefault();
$("#panel").slideToggle("3000");
});

При этой настройке форма контакта не отображает текущее значение поля выбора внутри его поля. Если я вместо этого удалю отображение: none; правило для панели div из моего CSS и скрыть форму после загрузки страницы:


$("#panel").hide();

Форма отображается правильно. Кто-нибудь знает, как я могу сделать эту работу и избежать вспышки открытой панели, которую я получаю, если я скрою ее с помощью jQuery после загрузки страницы?


Большое спасибо за любые советы. Пожалуйста, дайте мне знать, если я могу предоставить дополнительную информацию.

спросил(а) 2021-01-27T14:38:02+03:00 4 месяца, 4 недели назад
1
Решение
63

Проблема заключается в том, что jqtransform устанавливает ширину метки (в настоящее время видимое значение в преобразованном select), чтобы соответствовать ширине исходного выбора.


Если исходный select (или его родительский элемент) имеет display:none, и он не имеет указанной ширины css, результат .width() для этого элемента равен нулю.


Фактически вы можете проверить (используя инструменты firebug или google chrome dev), что это не та контактная форма не отображает текущее значение элемента select, а отображает его с шириной, равной нулю.

Самое простое решение в вашем случае - установить (в вашем файле css) фиксированную ширину для избранных, которые являются частью контактной формы. Таким образом, хотя сначала они будут скрыты, jqtransform установит правильную ширину для метки. Например:


/* css declaration */
#change-form select {
width: 390px;
}

Замечание: есть, конечно, другие способы заставить его работать, включая настройку jqtransform script в соответствии с вашим конкретным вариантом использования. Часть script, связанная с установкой указанной ширины метки, начинается в строке 289.

ответил(а) 2021-01-27T14:38:02+03:00 4 месяца, 4 недели назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема