マウスが上に来るとラジオボタンをチェックします

-6

ラジオボタンがクリックされていなければラジオボタンをチェックしようとします。それはいつ写真を表示するかです。私はJQueryでこれをやろうとしましたが、初心者です。マウスが上に来るとラジオボタンをチェックします

2017-04-23 gabriel chauviere

は、あなたがしようとしたコードを表示しますか？ここにコードを表示 –

@DanielH JS Fiddleでコードを要求しないでください。それでここにコードを頼んでください。外部リンクは時間が経つにつれて無効になることがあり、ヘルプを提供するためには誰かがやり遂げなければならない追加のステップです。実際に、FiddleやCodePenを使用する唯一の時間は、SOのスニペット環境が尋ねられているコードを実行しないときです。 –

@ScottMarcus確かに、ありがとう！ –

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
    <style> 
 
    </style> 
 
</head> 
 
<body> 
 
    <label> 
 
    <input type="radio" name="photo" data-image="http://placehold.it/350x150" class="radio-hover"> 
 
    Option - 1 
 
    </label> 
 
    
 
    <label> 
 
    <input type="radio" name="photo" data-image="http://placehold.it/250x150" class="radio-hover"> 
 
    Option - 2 
 
    </label> 
 
    
 
    <br> 
 
    
 
    
 
    <img src="http://placehold.it/350x150" class="photo1" alt=""> 
 

 

 
    <script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
    
 
    <script> 
 
    $(".radio-hover").hover(function(){ 
 
     var imageUrl = $(this).data("image"); 
 
     $("img").show(); 
 
     $("img").attr("src",imageUrl); 
 
    },function(){ 
 
     $("img").hide(); 
 
    }); 
 
    </script> 
 
</body> 
 
</html>

出典

2017-04-23 17:26:20 sepil

このコードスニペットは問題を解決するかもしれませんが、[説明を含む]（http://meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers）は本当にあなたの投稿の質を向上させるのに役立ちます。将来読者の質問に答えていることを覚えておいてください。そうした人々はあなたのコード提案の理由を知らないかもしれません。 – jmattheis

あなたはラジオを使用すると、現在のラジオでclickイベントをトリガ、または明示的にtrueにラジオのcheckedプロパティを設定するか、その時点でmouseenterイベントのために聞くことができます。ラジオとチェックボックスは、.attr()の代わりに.prop()を使用する必要があることを覚えておいてください.HTMLでは技術的に値を持たないため、名前付きプロパティのみです。

$(function() { 
 
    $(':radio').on('mouseenter', function() { 
 
    $(this).prop('checked', true); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="radio" name="radio-group" value="radio1"><br/> 
 
<input type="radio" name="radio-group" value="radio2"><br/> 
 
<input type="radio" name="radio-group" value="radio2"><br/>

出典

2017-04-23 17:26:36 Soviut

ありがとう！あなたのコードは私をとても助けました！このように変更しました $（function {）{ $（ 'スライダー入力[タイプ=ラジオ] +ラベル'）。on（ 'mouseenter'、function（）{$（ '。スライダ入力'）。prop（ 'checked'、true）; }）; }）; まだまだうまくいきません。私は明日それを働かせます –

あなたのラベルはラジオボタンの直後ですか？あなたはあなたの質問に何らかのソースコードを提供していませんでした。なぜそれがダウンリストされたのですか？ HTMLで質問を更新してください。 – Soviut

マウスが上に来るとラジオボタンをチェックします

答えて

関連する問題