Löve2d: How can i select object with mouse if it's overlap?

Question

I have already some code but i can't solved this. How can i select one object with mouse if the objects are overlap? It's looks like solitaire game. I wish you can understand me...

For example my code;

function love.load()

    love.graphics.setBackgroundColor(245, 255, 255)
    --1
    carda = {}
    carda.x       = 110
    carda.y       = 5
    carda.width   = 100
    carda.height  = 150
    carda.dragged = false
    carda.dropped = false
    --3
    cardb = {}
    cardb.x       = 110
    cardb.y       = 20
    cardb.width   = 100
    cardb.height  = 150
    cardb.dragged = false
    cardb.dropped = false
end
function love.draw()
    love.graphics.setColor(255, 255, 255)
    love.graphics.rectangle("fill", carda.x, carda.y, carda.width, carda.height)
    love.graphics.setColor(255, 128, 128)
    love.graphics.rectangle("line", carda.x, carda.y, carda.width, carda.height)
    love.graphics.setColor(0, 0, 100)
    love.graphics.print("Card\nA", carda.x + 5, carda.y + 5)
    --2
    love.graphics.setColor(215, 255, 225) 
    love.graphics.rectangle("fill", cardb.x, cardb.y, cardb.width, cardb.height) 
    love.graphics.setColor(255, 128, 128) 
    love.graphics.rectangle("line", cardb.x, cardb.y, cardb.width, cardb.height) 
    love.graphics.setColor(0, 0, 100)
    love.graphics.print("Card\nB", cardb.x + 5, cardb.y + 5)
end
function love.keypressed(key)
    if key=="escape" then
        love.event.quit()
    end
end
function love.mousepressed(x, y, button)
    if button == 1 and x >= carda.x and x <= carda.x + carda.width and y >= carda.y and y <= carda.y + carda.height then
        carda.dragged = true
    end
    --2
    if button == 1 and x >= cardb.x and x <= cardb.x + cardb.width and y >= cardb.y and y <= cardb.y + cardb.height then
        cardb.dragged = true
    end
end
function love.mousemoved(x, y, dx, dy)
    if carda.dragged then
        carda.x = carda.x + dx
        carda.y = carda.y + dy
    end
    --2
    if cardb.dragged then
        cardb.x = cardb.x + dx
        cardb.y = cardb.y + dy
    end
end
function love.mousereleased(x, y)
    carda.dragged = false
    --2
    cardb.dragged = false
end

Answer 1

If I understand your question correctly, you are asking when the two cards are on top of eachother how do you decide which gets grabbed? I guess you would chose whichever one is on top visually right? So in your draw function look which one is drawn last. I believe that one should be on top. If that is carda for example: set up your if statements as if else instead of seperate statements with carda first. Like this:

if button == 1 and x >= carda.x and x <= carda.x + carda.width and y >= carda.y and y <= carda.y + carda.height then
    carda.dragged = true
else if button == 1 and x >= cardb.x and x <= cardb.x + cardb.width and y >= cardb.y and y <= cardb.y + cardb.height then
    cardb.dragged = true
end

make sure in your draw function that carda is being drawn after cardb