Избегайте перемещения мышью по абсолютно расположенным дочерним элементам

Question

Избегайте перемещения мышью по абсолютно расположенным дочерним элементам

Не следует полагаться на конструктор Date JavaScript для синтаксического анализа строки. Поведение и поддерживаемые форматы сильно различаются для каждого браузера и локали. Здесь являются только некоторыми поведения по умолчанию, если вы напрямую используете объект Date.

Если вы должны исходить из строки, попробуйте использовать стандартизованный формат, такой как ISO8601. Дата, указанная в этом формате, будет "2012-06-25T12:00:00". Самый простой способ работать с ними в JavaScript - это moment.js .

Кроме того, будьте осторожны с тем, что вы на самом деле имеете в виду. Прямо сейчас вы проходите локальную дату / время, сохраняя локальный / дата / время и возвращая локальную дату / время. Попутно идея «локального» может измениться.

Во многих случаях дата / время предназначено для представления точного момента времени во времени. Чтобы выполнить эту работу, вам необходимо преобразовать с локального времени, введенного в UTC на клиенте. Отправьте UTC на свой сервер и сохраните его. Позже, получите UTC и отправьте его обратно своему клиенту, обработайте его как UTC и переведите обратно в локальное время. Вы можете сделать все это легко с помощью момента. Js:

// I'll assume these are the inputs you have.  Adjust accordingly.
var dateString = "6-25-2012";
var timeString = "12:00:00 PM";

// Construct a moment in the default local time zone, using a specific format.
var m = moment(dateString + " " + timeString, "M-D-YYYY h:mm:ss A");

// Get the value in UTC as an ISO8601 formatted string
var utc = m.toISOString(); // output: "2012-06-25T19:00:00.000Z"

На сервере в .Net:

var dt = DateTime.Parse("2012-06-25T19:00:00.000Z",   // from the input variable
                        CultureInfo.InvariantCulture, // recommended for ISO
                        DateTimeStyles.RoundtripKind) // honor the Z for UTC kind

Храните его в базе данных. Позже верните его и отправьте обратно:

// when you pull it from your database, set it to UTC kind
var dt = DateTime.SpecifyKind((DateTime)reader["yourfield"], DateTimeKind.Utc);

// send it back in ISO format:
var s = dt.ToString("o"); // "o" is the ISO8601 "round-trip" pattern.

Передайте его обратно в javascript в момент. Js:

// construct a moment:
var m = moment("2012-06-25T19:00:00.000Z"); // use the value from the server

// display it in this user's local time zone, in whatever format you want
var s = m.format("LLL");   // "June 25 2012 12:00 PM"

// or if you need a Date object
var dt = m.toDate();

См. - это было легко, и вы не нужно во что бы то ни стало придумать часовые пояса.

0

javascript dom mousemove css

задан saikiran 17 January 2019 в 03:08

1 ответ

Другие вопросы по тегам:

javascript dom mousemove css

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

score 0 · Answer 1

Просто проверьте, кто является целью в вашем обработчике событий, и если это один из тех, кому вы хотите заблокировать событие, вернитесь раньше.

В текущей конфигурации это то же самое, что и проверка, является ли цель действительно #main, a.k.a jQuery's $ event.currentTarget .

$('#main').on('mousemove', function(e) {
  // here we only want the events of #main
  // so any other target is irrelevant
  if (e.target !== e.currentTarget) return;
  var msg = "mouse move ";
  msg += e.pageX + ", " + e.pageY;
  $("#output").html(msg);
});
$('#main').on('mouseout', function() {
  $("#output").html('');
});
$('#main>.btn').on('click', e=> $("#output").html('can still click'));

#main {
  float: left;
  background: yellow;
  width: 400px;
  height: 400px;
  position: relative;
}

#main .btn {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
  border: 0;
  background: blue;
  color: #FFF;
}

#main .btn .innerbtn {
  padding: 10px;
}

#output {
  display: inline-block;
  background: #efefef;
  width: 200px;
  position: absolute;
  right: 0;
  pointer-events: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="main">
  <div class="btn">
    <div class="innerbtn">Click Me</div>
  </div>
</div>
<div id="output">

</div>