Значение привязки от входного текста до значения кнопки jquery

Как связать значения кнопок из текстового поля ввода. , когда мы нажимаем на кнопку, значение кнопки будет отображаться в текстовом поле, если мы изменим значение из входного текстового поля необходимо изменить выбранное значение кнопки тоже ..Значение привязки от входного текста до значения кнопки jquery

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>val demo</title> 
 
    <style> 
 
    button { 
 
    margin: 4px; 
 
    cursor: pointer; 
 
    } 
 
    input { 
 
    margin: 4px; 
 
    color: blue; 
 
    } 
 
    </style> 
 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
</head> 
 
<body> 
 
    
 
<div> 
 
    <button>Feed</button> 
 
    <button>the</button> 
 
    <button>Input</button> 
 
</div> 
 
<input type="text" value="click a button"> 
 
    
 
<script> 
 
$("button").click(function() { 
 
    var text = $(this).text(); 
 
    $("input").val(text); 
 
}); 
 
</script> 
 
    
 
</body> 
 
</html>

источник

2016-02-04 Vijju Sena

'если мы изменим значение из входных текстового поля необходимо изменить выбранное значение кнопки too' как бы вы разницу между выбранной и неотобранной кнопкой? – gurvinder372

Попробуйте

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>val demo</title> 
 
    <style> 
 
    button { 
 
    margin: 4px; 
 
    cursor: pointer; 
 
    } 
 
    input { 
 
    margin: 4px; 
 
    color: blue; 
 
    } 
 
    </style> 
 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
</head> 
 
<body> 
 
    
 
<div> 
 
    <button>Feed</button> 
 
    <button>the</button> 
 
    <button>Input</button> 
 
</div> 
 
<input type="text" value="click a button"> 
 
    
 
<script> 
 
var button = $(); 
 
$("button").click(function() { 
 
    button = $(this); 
 
    var text = $(this).text(); 
 
    $("input").val(text); 
 
}); 
 
$("input").on("input", function(){ 
 
    button.html($(this).val()); 
 
}); 
 
</script> 
 
    
 
</body> 
 
</html>

источник

2016-02-04 07:49:56 mylee

спасибо, много :) –

Очень хорошо. (Y). Up – RRK

@mylee, если «ínput» находится на странице, а «кнопки» находятся на другой странице .. где привязка не работает между ними, тогда как мы можем это решить? –

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>val demo</title> 
 
    <style> 
 
    button { 
 
    margin: 4px; 
 
    cursor: pointer; 
 
    } 
 
    input { 
 
    margin: 4px; 
 
    color: blue; 
 
    } 
 
    </style> 
 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
</head> 
 
<body> 
 
    
 
<div> 
 
    <button>Feed</button> 
 
    <button>the</button> 
 
    <button>Input</button> 
 
</div> 
 
<input type="text" value="click a button"> 
 
    
 
<script> 
 
var actualButton; 
 
$("button").click(function() { 
 
    actualButton = $(this); 
 
    var text = $(this).text(); 
 
    $("input").val(text); 
 
}); 
 
$("input").on('keyup', function(e){ 
 
    if(actualButton === undefined) 
 
    return; 
 

 
    actualButton.text($(this).val()); 
 
}); 
 
</script> 
 
    
 
</body> 
 
</html>

Edit: Оо кто был быстрее;)

источник

2016-02-04 07:52:58

:) спасибо .. :) –

приветствуется :) –

Если «ínput» находится на странице, а «кнопки» находятся на другой странице .. где привязка не работает между ними, тогда как мы можем решить эту проблему ?? –

Значение привязки от входного текста до значения кнопки jquery

ответ

Смежные вопросы