Как добавить атрибут, отличный от атрибутов стиля, в css?

Я работаю над программой html/css/javascript, которую вы можете решить sudokus, которую создает программа, например, онлайн-головоломкой. Из-за этого у меня есть много, если <input /> тегов (81, если быть точным) для уникальных идентификаторов для каждого из них. Но мне также пришлось написать атрибут maxlength для каждого тега <input />, который я написал.Как добавить атрибут, отличный от атрибутов стиля, в css?

Мне интересно, можете ли вы сделать это в css вместо этого. Можете ли вы иметь атрибуты других атрибутов стиля (например, border или margin) в CSS? Если да, то как вы ссылаетесь на них? Я попытался ввести его напрямую, но, похоже, его не существует.

Мой examplar вход тег: <input id="00" type="text" onclick="checkIfBold('00')" maxlength="1"/>

CSS-для тега:

input { 
    border: 0px solid #000; 
    width: 100%; 
    height: 100%; 
    font-size: 200%; 
    text-align: center; 
}

Моя цель состоит в том, чтобы установить атрибут <input /> элемента maxlength с помощью CSS.

Обратите внимание, что я не просто спрашиваю об этом конкретном атрибуте, я спрашиваю, как ссылаться на любой другой атрибут html в css (если возможно)?

источник

2014-02-20 Arbiter

Вы спрашиваете, например, как установить максимальную длину для всех входов через CSS вместо встроенного? Поскольку вы используете Javascript, будет ли решение JS/jQuery работать для вас? –

Да, но я бы предпочел использовать CSS. – Arbiter

Ну, я не думаю, что это возможно с помощью CSS, и если это так, это будет какой-то странный хак, который, вероятно, не будет работать во всех браузерах и будет чрезвычайно трудным для использования ... Я отправляю jQuery решение ниже, которое будет работать только отлично для вас, хотя. –

Основываясь на мой комментарий выше:

Вы не можете сделать это с помощью CSS, но это очень просто сделать с JQuery ...

$(document).ready(function() { 
    $("input").attr('maxlength','1'); 
});

коммутатора вне '1' с любым номером вы хотите MaxLength быть, и вы также можете переключиться из 'maxlength' с любым другим атрибутом, который требуется настроить таргетинг.

источник

2014-02-20 21:48:30

Хорошо, спасибо за вашу помощь. Наверное, мне просто нужно будет использовать Javascript или просто вводить каждый элемент отдельно. – Arbiter

@Arbiter Нет проблем, удачи! –

Вы не можете. CSS предназначен для определения того, как должны выглядеть вещи посмотреть. maxlength определяет способ ввода . maxlength определяет функциональность. Если вы хотите указать ввод определенного (визуального) размера, используйте свойство CSS width.

источник

2014-02-20 21:43:06 GolezTrol

sry, я пропустил вопрос ** получить красный ** – halfbit

Это невозможно с помощью CSS. Вы можете использовать javascript/jQuery.

Вот пример для JQuery:

$('input[type="text"]').attr('maxlength', '1');

источник

2014-02-20 21:45:37 Sebsemillia

Я думаю, вопрос заключается в получении (ложной) идеи о том, что каждый атрибут может или должен быть определен в CSS. Поскольку это невозможно, вы можете добавить атрибуты в HTML. Не нужно писать Javascript для него, особенно если эти 81 входы генерируются скриптом на стороне сервера. Но приятно знать, как это сделать. :) – GolezTrol

@GolezTrol Я согласен, что для JS нет необходимости *, но поскольку цель OP заключается в том, чтобы сэкономить время/усилие при ручной типизации (копировании/вставке) атрибутов maxlength для каждого элемента, этот ответ в конечном итоге сделает это. .. –

Я бы не рекомендовал делать это с помощью Javascript, но, как вы указали через скрипт на стороне сервера. Но я попытался помочь OP с его вопросом и показать ему быстрое клиентское решение, поскольку он попытался приблизиться к нему и на стороне клиента с CSS. – Sebsemillia

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

[border]{ 
    /*styles for elements with a border*/ 
}

или

[border=1px solid black]{ 
    /*styles for elements with a border of EXACTLY 1px solid black, in that order*/ 
}

нет маски или частичные совпадения. Вероятно, Javascript может выбрать более конкретно или изменить что-либо, кроме стилей.

источник

2014-02-20 21:51:05 MaxPRafferty

Я думаю, что вы, возможно, неправильно поняли вопрос. OP не хочет * выбирать * элементы с определенными атрибутами, но * устанавливает * эти атрибуты. –

А - я вижу. Тогда возникает фундаментальное понимание. Атрибутами стиля являются css и css - атрибуты стиля, не более того. – MaxPRafferty

Да, и вы, возможно, не поняли ... После того, как я опубликовал свой комментарий, я перешел к вопросу о повторном чтении OP, и это не слишком понятно, так что вы можете быть на высоте ... Только один из тех вопросов, которые я предполагаю ! –

Как добавить атрибут, отличный от атрибутов стиля, в css?

ответ

Смежные вопросы