Форум

MBmusic · #1 (**permalink**) 03.07.2013, 20:27

в общем вот код:

<table border="1px"> 
	<tr> 
		<td>1</td>
		<td>2</td> 
		<td>3</td> 
	</tr>
</table>

$(function() { $('td').click(function() { 
var val = $(this).html(); 
var code = '<input type="text" id="edit" value="'+val+'" />';  $(this).empty().append(code);
 $('#edit').focus(); }); });

при нажатии на ячейку ничего не происходит......а должно добавлять инпут......что не так?

bes · #2 (**permalink**) 03.07.2013, 20:38

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

MBmusic · #3 (**permalink**) 03.07.2013, 20:51

в смысле, не понял о чем вы?) в коде есть ошибки?

рони · #4 (**permalink**) 03.07.2013, 21:01

MBmusic,
вот это вас просили

[HTML RUN][/HTML]

сделать
но тут всё работает за исключением непродуманности 500 кликов по 1 ячейке.

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script>
  $(function()
    {$('td').click
      (function()
        {
          var val = $(this).html();
          var code = '<input type="text" id="edit" value="'+val+'" />';
          $(this).empty().append(code);
          $('#edit').focus();}
      );
    }
  );
  </script>
</head>
<body>

  <table border="1px">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
</table>
</body>
</html>

bes · #5 (**permalink**) 03.07.2013, 21:40

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<style>
td {
	border: solid 1px gray;
	padding-left: 0.3em;
	padding-right: 0.3em;
	cursor: pointer;
}
</style>
<table>
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
</table>
<script>
jQuery(function($){
	$('td').click(function() {
		var inputs = $(this).children("input");
		var text = $(this).text();
		var inp;
		if (inputs.length == 0) {
			inp = $(document.createElement("input")).attr("size", text.length).val(text);
			$(this).empty().append(inp);
			inp.focus();
			inp.on("blur", function () {
				$(this).parent().html($(this).val());
			});
		}
	});
});
</script>

Форум

Справочник

Discord чат

Курсы javascript