Question

我真的不知道如何处理这个问题。我已经阅读了大约10个小时的javascript，html，css，if语句，条件等等（初学者尝试学习所有内容＆gt; _＆lt;）。这很有趣，但我更倾向于如何处理这个问题。

这就是我想要完成的事情。我希望用户能够点击2张图片中的1张，然后将图片的值从0更改为1 ....或者选择？然后我想再一次做这个确切的场景（所以基本上是两个不同的输入选择）。最后，如果两个值都从0更改为1，我希望将内容插入到页面上的其他位置。

我也因为我的问题而公然没有受过教育而道歉。我尽我所能去学习，我绝对喜欢试错。

编辑：这是我在这个网站上的第一篇文章。你们真是难以置信。给我一些时间来阅读所有评论。我必须查看你们所提到的很多东西才能完全理解它。

再次感谢。

Answer 1

你想要的是这个：

var pic1 = false
  , pic2 = false;

$( '.pic1' ).bind( 'click', function(){
    pic1 = true;
    check();
} );

$( '.pic2' ).bind( 'click', function(){
    pic2 = true;
    check();
} );

function check(){
    if( pic1 && pic2 ){ // do something here }
}

Answer 2

这样的事情怎么样：

var selected[0] = false;
var selected[1] = false;
function imageClicked(tag) {
    selected[tag] = !selected[tag];
    self.selectedTagValueChanged();
};

function selectedTagValueChanged() {
    if (selected[0] && selected[1] {
        //Inserrt your DOM manipulation stuff here
    }
}

每次调用imageClicked函数时，此代码都会更改标记的值，然后再单击该值（如切换）。

Answer 3

html

<img src="" id="Picture1">
<img src="" id="Picture2">

脚本

//Apply a click event to both pictures and have it callback to the checkClick function
$("#Picture1, #Picture2").click(checkClick);

function checkClick(e)
{
    //$(this) will refer to the currently clicked picture, 
    //jQuery's .data function allows storing data within the object
    $(this).data("clicked",1);

    //Grab the data values from both pictures
    var p1 = $("#Picture1").data("clicked");
    var p2 = $("#Picture2").data("clicked");

    //Check if both equal 1 (will once each has been clicked)
    if( p1 == 1 && p2 == 1 )
        ShowContent();
}

function ShowContent()
{
    //do your code to show content
}

Answer 4

将任意数据添加到任意HTML元素的一种方法是使用数据属性。您的问题的一个解决方案可能是，当用户单击它时，将data-clicked设置为1，然后检查组合条件。示例（使用jQuery）：

<img class="clickable-image" src="..." data-clicked="0"/>
<img class="clickable-image" src="..." data-clicked="0"/>
<script type="text/javascript>
    $(".clickable-image").click(function() {
        $(this).data("clicked") = 1;
        var allOnes = true;
        $(".clickable-image").each(function() {
            allOnes = allOnes && $(this).data("clicked") == 1;
        });
        if ( allOnes ) {
            // Your custom code
        }
    });
</script>

在满足两个条件值后插入内容

4 个答案: