удалить семейство шрифтов из telerik radcombobox из jquery - PullRequest
0 голосов
/ 27 ноября 2018

Я создаю веб-приложение на c # с js, в котором я использую компонент telerik,

проблема в том, что пользовательский класс для моего раскрывающегося списка telerik:

.RadComboBox_Bootstrap {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

, теперь я хочучтобы удалить этот класс, я сделал что-то вроде следующего:

$('.RadComboBox_Bootstrap').css({'font-family':''})

И

$('.RadComboBox_Bootstrap').css({'font-family':'Arial !important'})

, но у меня ничего не получилось,

Я попробовал следующее

$('.RadComboBox_Bootstrap').eq(13).css({'font-size':'8px'})

и размер шрифта radcombobox изменился, но когда я пытаюсь изменить семейство шрифтов, я не могу добиться успеха, в чем здесь может быть проблема?

Ответы [ 2 ]

0 голосов
/ 10 декабря 2018

Если вы хотите отключить встроенный скин, вы можете установить для свойства EnableEmbeddedSkins значение false или, если вы хотите переопределить только несколько правил, лучше создать свой собственный класс, добавьте его в ComboBox, используя свойство CssClass,В файле CSS сделайте сильный селектор для вашего класса и переопределите правила.Элементы управления Telerik полагаются на свои собственные классы, и их удаление может привести к неожиданному появлению.

<telerik:RadComboBox ID="RadComboBox1" runat="server" EnableEmbeddedSkins="false" CssClass="myClass">
</telerik:RadComboBox>

См. Специфичность и Специфичность CSS: то, что вы должны знать , чтобы получитьлучшее понимание селекторов классов CSS и способов их укрепления.

Обновление:

Смена шрифта может быть достигнута с помощью чистого CSS.Все, на чем вам нужно сосредоточиться, это упомянутая выше специфика CSS.

Важно знать, что Telerik RadComboBox состоит из двух отдельных элементов HTML.Элемент RadComboBox и элемент RadComboBoxDropDown.Один элемент, выбранный элемент, принадлежит элементу RadComboBox, в то время как остальные элементы, отображаемые при открытии DropDown, относятся к элементу RadComboBoxDropDown.

Изменение шрифта для элемента RadComboBox изменится только длявыбранный пункт.Также необходимо применить дополнительный стиль к элементам в RadComboBoxDropDown.

Пример CSS:

html body .RadComboBox_Bootstrap, /** font for RadComboBox */
html body .RadComboBoxDropDown_Bootstrap { /** font for RadComboBoxDropDown */
    font-family: cursive;
}

enter image description here

0 голосов
/ 27 ноября 2018

У меня вопрос: вы сказали, что хотите удалить класс, но затем вы пытаетесь переопределить правило css ... что вы хотите архивировать?

В случае, если вы хотите удалитькласс вы должны использовать метод removeClass.См. Документацию здесь ;

Если вы хотите переопределить правило css: возможно ли, что ваш

$('.RadComboBox_Bootstrap').css({'font-family':''})

будет выполнен до того, как элемент .RadComboBox_Bootstrap будет представлен / разработан?(это функция $('.RadComboBox_Bootstrap').css({'font-family':''}) в document.ready (или $(function(){...})))?).Если инструкция выполняется до загрузки dom, селектор jQuery не находит элементов и не применяет правило css.В этом примере правило будет НЕ применяться

<html>
    <head>
        <!-- import jquery here -->
        <script>
           $('.RadComboBox_Bootstrap').css({'font-family':''})
        </script>
    </head>
    <body>
        <div class="RadComboBox_Bootstrap"></div>
    </body>
</html>

В этом примере оно будет

<html>
    <head>
        <!-- import jquery here -->
        <script>
            $(function(){
                $('.RadComboBox_Bootstrap').css({'font-family':''});
            });
        </script>
    </head>
    <body>
        <div class="RadComboBox_Bootstrap"></div>
    </body>
</html>

В любом случае вы всегда можете написать собственное правило CSS для переопределениятот, о котором вы сообщили:

.my-wrapper .RadComboBox_Bootstrap {
    font-family: Arial,sans-serif;
}

(вы должны добавить my-wrapper class к родителю).Таким образом, ваше пользовательское правило будет «более конкретным» для элемента dom и будет применено.См. this для подробностей

...