0
私は2つのdivを含むフォームを持っていて、各divには入力があり、各入力に関連付けられたボタンを押すと何も起こりません。フォームのdivと一緒に私は2つのdivがないときにこのコードが動作することを知っていますが、私はdivにする必要があるので、私はレイアウトをそのままにすることができます。助言がありますか？1つのフォーム、2つのDivs、JQueryが機能しない
私はこの記事にJQueryを追加するのを忘れていたことは間違いありませんでしたが、JQueryを追加してもこのコードが基づいているプロジェクトでは機能していないと付け加えました。
ライブコード：https://jsfiddle.net/1brk3npL/
$(document).ready(function() {
$('#addLikes').click(function() {
if ($('#likes').val() === "") {
alert("Likes input is empty.");
} else {
$('#likesOutput').append($("<option></option>")
.attr("value", $('#likes').val()).text($('#likes').val()));
}
});
$('#removeLikes').click(function() {
$('#likesOutput option:selected').remove();
});
$('#addDislikes').click(function() {
if ($('#dislikes').val() === "") {
alert("Dislikes input is empty.");
} else {
$('#dislikesOutput').append($("<option></option>")
.attr("value", $('#dislikes').val()).text($('#dislikes').val()));
}
});
$('#removeDislikes').click(function() {
$('#dislikesOutput option:selected').remove();
});
});select {
width: 250px;
}
input[type=text] {
font-family: "ProximaRegular", sans-serif;
width: 250px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="preferenceDiv">
<form id="preferenceInput">
<div style="float:left; position:relative; width : 50%;">
Likes:
<br/>
<input type="text" id="likes" />
<br />
<button id="addLikes" type="button">Add Likes</button>
<button id="removeLikes" type="button">Remove Likes</button>
<br />Selected Likes:
<br />
<select id="likesOutput" multiple="multiple"></select>
</div>
<div style="float:left; position:relative; width : 50%;">
Dislikes:
<br/>
<input type="text" id="dislikes" />
<br />
<button id="addDislikes" type="button">Add Dislikes</button>
<button id="removeDislikes" type="button">Remove Dislikes</button>
<br />Selected Dislikes:
<br />
<select id="dislikesOutput" multiple="multiple"></select>
</div>
</form>
</div>
jQueryをインクルードすると、コードが正常に動作しているようです。https://jsfiddle.net/1brk3npL/1/ –
JSFiddleは2つの場所で間違っていました.jQueryをインクルードし、オンロードではなく実行します。私があなたのために作ったスニペットを見てください – mplungjan
これは変です; JQueryを私の例に含めるのを忘れてしまった、私の間違い。しかし、この例は、私が取り組んでいるプロジェクトを代表するものであり、JQueryを含んでおり、すべてが非常によく似た方法で行われていますが、うまくいきません。 :(非常に奇妙な –