Позиционирование getElementById в HTML и Javascript

Вы можете сделать, как дать ниже

<input type="text" id="txtbox" name="txtbox" value="" class="form-control">
<script>
    var x= document.getElementById("txtbox").value;
    document.getElementById("demo").innerHTML = x;

    //or you can use jquery if you want

    var x = $("#txtbox").val();
    ("#demo").html = x;
</script>
0
задан S.Liao 20 January 2019 в 16:21
поделиться

1 ответ

После прочтения вашего разъяснения и изучения вашего кода, вот что я могу предложить.

<p id="correctScreen">Correct Answers:<span id="correctScore"></span></p>
<p id="" style="font-size: 20;color: azure;margin-left: 60%;"></p>
<p id="wrongScreen">Wrong Answers:<span id="wrongScore"></span></p>
<p id="secondPara" style="font-size: 20;color: azure; margin-left: 60%;"></p>

Правильный интервалScore - это место, где вы хотите, чтобы появился текст «Вы получили ...», и вы могли бы сделать это, просто заменив $("#correctScore").text(score); на $("#correctScore").text("You got question 1 right"); (И, очевидно, вы захотите переименовать свой элементы и переменные, поэтому они имеют смысл при замене.)

Единственная проблема заключается в том, что следующая строка текста (текст для вопроса 2) будет выровнена по вертикали с «Правильными ответами», а не с вопросом 1 текст. Самый простой способ исправить это (и не совсем профессионально) - добавить группу из &nbsp символов для отступа в вашем тексте. Ниже приведены некоторые другие (лучшие) варианты.

Используя только HTML-разметку, вы можете заменить span на блочный элемент, например, div (и изменить correctScreen с p на div, чтобы эта работа работала). Уловка в том, что переключение на элемент блока также означает, что содержимое будет начинаться с новой строки, поэтому они не будут рядом с «Правильными ответами», как вам хотелось бы - если вы не стилизовали элемент блока с помощью float: left ( и сделал другие изменения, связанные с этим, такие как указание атрибута width для ваших элементов div.)

Или, так как ваша страница имеет начальную загрузку, вы можете избежать обработки (некоторых из) этих деталей самостоятельно и получить два элемента div. появляться рядом, выполняя что-то вроде этого:

<div class="row">
  <div class="col-md-4" id="spacer"></div>
  <div class="col-md-4" id="correctAnswersIntro">Correct answers:</div>
  <div class="col-md-4" id="correctAnswersList">You got question 1 right<br></div>
</div>
0
ответ дан Cat 20 January 2019 в 16:21
поделиться
Другие вопросы по тегам:

Похожие вопросы: