Question

我想在输入字段中显示当前时间。我使用了id local-time。但是在输入字段中，当前时间没有显示。

Current Time : <input type="text" id = "local-time" value= ""/>

<script>
setInterval(function() {
var local = new Date();
var localdatetime = local.getHours() + ":" + pad(local.getMinutes()) + ":" + 
pad(local.getSeconds());

$('#local-time').html(localdatetime);
}, 1000);

function pad(t) {
var st = "" + t;

while (st.length < 2)
st = "0" + st;

return st;  
}
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

只需编辑脚本：将html更改为val

<script>
setInterval(function() {
var local = new Date();
var localdatetime = local.getHours() + ":" + pad(local.getMinutes()) + ":" + 
pad(local.getSeconds());

$('#local-time').val(localdatetime);
}, 1000);

function pad(t) {
var st = "" + t;

while (st.length < 2)
st = "0" + st;

return st;  
}
</script>

Answer 2

您尝试设置该输入元素的html而不是value。

.val()使用.html() .text() $('#local-time').val(localdatetime);

@echo off
for /f %%i in ('call git status --porcelain') do set stash=%%i
if not [%stash%] == [] (
  echo Stashing local changes...
  call git add .
  call git stash -q
)
echo Updating App...
call git pull origin master
if not [%stash%] == [] (
  echo Restoring local changes...
  call git stash apply -q
)
echo Updating Dependencies...
call npm update
echo Done
pause

Answer 3

$(document).ready(() => {
  console.log('DOMContentLoaded on app');


  //----------------------------------------------
  //Build walls
  const tx = 100;
  const bx = 600;
  const ly = 10;
  const my = 650;
  const ry = 750;
  const $main = $('main');
  const thick = 10;
  const goal = 100;
  let wallArray = [];

  //outline walls
  $main.append(buildWalls(tx, ly, thick, my - ly - goal));
  $main.append(buildWalls(tx, my, thick, ry - my));
  $main.append(buildWalls(tx, ry, bx - tx + thick, thick));
  $main.append(buildWalls(bx, ly, thick, ry - ly));
  $main.append(buildWalls(tx, ly, bx - tx, thick));
  // inside walls
  $main.append(buildWalls(200, 300, 75, thick));
  $main.append(buildWalls(400, 500, thick, 75));
  $main.append(buildWalls(500, 150, 75, thick));
});

// build walls with inputs


function buildWalls(top1, left1, height1, width1) {
  const wall = $('<div>', {
    class: 'wall',
  })
    .css({
      top: top1,
      left: left1,
      height: height1,
      width: width1,
    });

  return wall;
}

  //----------------------------------------------
  // tool, prize, and goal

const bPx = 600;
const bPy = 150;
const speed = 5;
const time = 100;
const tool = createTool();
const prize = createPrize();
const moveFunctions = moving(tool, bPy, bPx, speed);

function createTool() {
  return $('<div>')
    .addClass('tool black')
    .attr('id', 'tool')
    .css({ left: bPx, top: bPy })
    .appendTo($('main'));
}

function createPrize() {
  return $('<div>')
    .addClass('prize')
    .attr('id', 'prize')
    .css({ left: 50, top: 550 })
    .appendTo($('main'));
}


//_________________________________________
//  for moving the tool around

function moving($el, bPy, bPx, speed) {
  let drag = 0;
  return {
    moveUp() {
      bPy -= speed;
      drag = drag *= -1;
      // $el.css('top', bPy);
      // console.log($el);
    },
    moveLeft() {
      bPx -= speed;
      drag = -1;
    },
    moveDown() {
      bPy += speed;
      drag = 1;
    },
    moveRight() {
      bPx += speed;
      drag = 1;
    },
    looper() {
      $el.css({
        left: bPx += drag,
        top: bPy += drag,
      });
    },
  };
}


// };
setInterval(moveFunctions.looper, time);

// key controls
$(document).keydown((event) => {
  console.log(event.keyCode);
  const key = event.which;
  switch (key) {
    // let keepMoving = 0;
    // move object left
    case 37:
      moveFunctions.moveLeft();
      checkCollisions();
      break;
    // move object right
    case 39:
      moveFunctions.moveRight();
      checkCollisions();
      break;
    // move object up
    case 38:
      moveFunctions.moveUp();
      console.log('{tool} up');
      checkCbreak; llisions();
      break;
    // move object down
    case 40:
      moveFunctions.moveDown();
      checkCollisions();
      break;
    // stop movement... used for when collision happens
    case 32:
      alert('stop');
      break;
  }
});

// get blocks corners .. wall, tool, item
function getPositions(block) {
  const $block = $(block);
  const pos = $block.position();
  const width = $block.width();
  const height = $block.height();
  return [[pos.left, pos.left + width], [pos.top, pos.top + height]];
}


// compare if they have overlaping coordinates
function comparePositions(p1, p2) {
  const x1 = p1[0] < p2[0] ? p1 : p2;
  const x2 = p1[0] < p2[0] ? p2 : p1;
  return !!(x1[1] > x2[0] || x1[0] === x2[0]);
}


function checkCollisions() {
  const block = $('.wall')[0];
  const pos = getPositions(block);
  console.log(this);
  const pos2 = getPositions(this);
  const horizontalMatch = comparePositions(pos[0], pos2[0]);
  const verticalMatch = comparePositions(pos[1], pos2[1]);
  const match = horizontalMatch && verticalMatch;
  if (match) { alert('COLLISION!!! Finally !!!'); }
}

如何使用jQuery设置输入字段的值

3 个答案: