Element visible for hover but invisible for click

Question

I'm writing an automation script for a checkout page with Selenide. There's an element on a page that represents checkbox for terms and conditions. I've tried to click it but no success. However, hover command works properly without any errors. So it is not visible for clicking but visible for hovering. How can it be clicked?

<input type="checkbox" name="order[accept_terms_and_conditions]" 
id="order_accept_terms_and_conditions" value="1" aria-label="Accept 
terms and conditions">

Th element selector:

private By termsCheckbox = By.xpath("//*[@id=\"bottom_form\"]/fieldset/ol/li/label/input");

The method with action

public void clickTermsCheckbox(){
$(termsCheckbox).hover().click();
}

Error

Element should be visible {By.xpath: //*[@id="bottom_form"]/fieldset/ol/li/label/input}

Answer 1

尝试单击父元素：

$(termsCheckbox).parent().click()