Nano Hash - криптовалюты, майнинг, программирование

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

У меня это работает с начальной точкой как диапазоном, но я хочу, чтобы форма все еще функционировала, если javascript отключен в браузере вот как это работало у меня изначально. Я все еще очень новичок в javascript, может кто-нибудь протянуть руку, пожалуйста.

window.onload = function() {

  document.getElementById('container').onclick = function(event) {
var span, input, text;

// Get the event (handle MS difference)
event = event || window.event;

// Get the root element of the event (handle MS difference)
span = event.target || event.srcElement;

// If it's a span...
if (span && span.tagName.toUpperCase() === "SPAN") {
  // Hide it
  span.style.display = "none";

  // Get its text
  text = span.innerHTML;

  // Create an input
  input = document.createElement("input");
  input.type = "text";
  input.size = Math.max(text.length / 4 * 3, 4);
  span.parentNode.insertBefore(input, span);

  // Focus it, hook blur to undo
  input.focus();
  input.onblur = function() {
    // Remove the input
    span.parentNode.removeChild(input);

    // Update the span
    span.innerHTML = input.value;

    // Show the span again
    span.style.display = "";
      };
    }
  };
};
javascript forms
27.07.2011

Ответы:


1

Лучший способ сделать это — сначала показать ввод, затем быстро заменить его при загрузке страницы, а затем вернуть обратно, когда пользователь щелкает.

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

27.07.2011

2

Затем просто поместите туда поля ввода с самого начала и скройте их скриптом, который запускается при загрузке формы. Таким образом, все поля будут видны, если Javascript не поддерживается.

27.07.2011
  • это то, что я хочу сделать, но на самом деле не знаю, как, кодовый блок выше был написан кем-то другим, я пытался работать в обратном направлении, но безуспешно 28.07.2011

    • 3

    Я думаю, что лучшим вариантом будет обернуть форму тегами noscript, которые будут срабатывать, когда Javascript отключен в браузере. Если они отображаются даже в тегах noscript, просто установите их как невидимые с помощью Javascript.

    27.07.2011

    4

    если у вас есть jQuery, что-то вроде этого должно работать.

    function makeElementIntoClickableText(elm){
  $(elm).parent().append("<div onClick='switchToInput(this);'>"+ elm.value +"</div>");
  $(elm).hide();
}

function switchToInput(elm){
    $(elm).prev().prev().show();
    $(elm).hide();
}

makeElementIntoClickableText($("input")[0]);
    27.07.2011

    5

    используйте атрибут readonly в элементах input:

    <input type="text" readonly />

    А затем удалите этот атрибут с помощью JavaScript в обработчике события onclick, переназначив его на blur:

    var inputs = document.getElementsByTagName('input');

for (i=0; i < inputs.length; i++) {
    inputs[i].setAttribute('readonly',true);
    inputs[i].onclick = function(){
        this.removeAttribute('readonly');
    };
    inputs[i].onblur = function(){
        this.setAttribute('readonly',true);
    };
}

    демонстрация JS Fiddle.

    27.07.2011
  • если я что-то упустил, это сделало бы форму бесполезной, если бы javascript был отключен 28.07.2011
  • @Philbert: Ой. Я исправил JavaScript, поэтому readonly применяется, удаляется и повторно применяется JavaScript, а не устанавливается в HTML. Однако вы были правы, изначально этот ответ был бы недружелюбным к JS... упс. знак равно 28.07.2011
  • Мне все еще не везет с этим. это моя тестовая страница могу ли я получить чек на идиота, пожалуйста, здесь уже поздно. 28.07.2011
  • Я просто вижу поля ввода, они не меняются. 29.07.2011
    • Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..